:root {
	--color-style-0:		#FFFFFF;
	--color-style-1:		#0A4ECC;
	--color-style-2:		#091D5C;
	--color-style-3:		#E7420C;
	--color-style-4:		#DEDEDC;
	--color-style-5:		#FFC966;
}

div.block {
}



body {
	font-family:			Arial, Helvetica, sans-serif;
}

a {
	text-decoration:		none;
	color:				var(--color-style-0);
}

section.main {
	margin:				2em;

	display:			grid;
	grid-template-columns:		auto auto;
	grid-template-rows:		5em auto auto;
	grid-gap:			3em;
}

section.main > div {
	border-radius:			1em;
}



section.main > div.tile {
	display:			flex;
	align-items:			center;
	justify-content:		center;
	padding:			3em;
}

section.main > div.domain {
	grid-area:			1 / 1 / 2 / 2;
	/*
	grid-row:			1 / 2;
	grid-column:			1 / 2;
	*/

	background-color:		var(--color-style-1);
	color:				var(--color-style-0);
}

section.main > div.info {
	grid-area:			1 / 2 / 2 / 2;
	/*
	grid-row:			1 / 2;
	grid-column:			2 / 2;
	*/

	background-color:		var(--color-style-5);
	color:				var(--color-style-3);
}

section.main > div.action {
	grid-area:			3 / 1 / 4 / 3;
	/*
	grid-row:			3 / 4;
	grid-column:			1 / 3;
	*/

	background-color:		var(--color-style-4);
	color:				var(--color-style-2);
}

section.main > div.other {
	grid-area:			2 / 1 / 3 / 3;
	/*
	grid-row:			2 / 3;
	grid-column:			1 / 3;
	*/

	background-color:		var(--color-style-0);
	color:				var(--color-style-2);

	border:				1px solid var(--color-style-4);
	border-radius:			1em;
}



section.main > div.domain > h1 {
	color:				var(--color-style-0);
	font-size:			150%;
	text-align:			center;
	letter-spacing:			0.1em;
}

section.main > div.info > div {
	text-align:			center;
}

section.main > div.info	> div > h2 {
	font-size:			120%;
	color:				var(--color-style-0);
	text-align:			center;
}

section.main > div.info > div > p > a {
	text-decoration:		underline;
}

section.main > div.action > div {
	text-align:			center;
}

section.main > div.action > div > h3 {
	color:				var(--color-style-3);
}

section.main > div.action > div > p {
	color:				var(--color-style-1);
}



section.main > div.action > div > div.form {
	margin:				2em 1em 0 1em;
}

section.main > div.action > div > div.form > form label {
	width:				30em;
	margin:				1em auto;
	display:			block;
	padding:			0 1em;
	text-align:			left;
	font-size:			80%;
	font-weight:			bold;
	color:				var(--color-style-2);
}

section.main > div.action > div > div.form > form input {
	width:				100%;
	height:				2em;
	padding:			0.2em 0.5em;
	color:				var(--color-style-1);
}

section.main > div.action > div > div.form > form textarea {
	-webkit-box-sizing:		border-box;
	-moz-box-sizing:		border-box;
	box-sizing:			border-box;

	width:				100%;
	height:				10em;
	padding:			0.5em 1em;
	color:				var(--color-style-1);
	resize:				none;
}

section.main > div.action > div > div.form > form button {
	margin:				2em 0 0 0;
	padding:			0.5em 1em;
	background-color:		var(--color-style-2);
	border-color:			var(--color-style-2);
	color:				var(--color-style-0);
	font-weight:			bold;
	border-radius:			1em;
}



section.main > div.other > div {
	padding:			1em;
	text-align:			center;
}

section.main > div.other > div > h4 {
	color:				var(--color-style-2);
}

section.main > div.other > div > div  {
	display:			flex;
	align-items:			center;
	justify-content:		center;
	height:				20em;
}



footer {
	width:				95%;
	margin:				3em auto;
	padding:			0;
	text-align:			center;

	font-size:			80%;
	color:				var(--color-style-1);
	border-top:			1px solid var(--color-style-1);

	display:			grid;
	grid-template-columns:		auto auto;
	grid-template-rows:		auto;
}

footer > div.left {
	grid-area:			1 / 1 / 1 / 2;
	text-align:			left;
}

footer > div.right {
	grid-area:			1 / 2 / 1 / 3;
	text-align:			right;
}


div.ads {
	width:				1000px;
	margin:				0 auto 0 auto;
	padding:			0;
	text-align:			center;

	/*
	border:				1px solid var(--color-style-1);
	border-radius:			1em;
	*/
}