body {

	font-family: Futura Std;

	height: 100%;
	margin: 0;

	@media screen and (min-width: 500px) {
		.content {
			.content-container {
				max-width: 300px;
			}
		}
	}


	.optionalParent {
		margin-top: 1em;
	}

	.vert-container {
		margin-top: 2em;
	}

	h1 {
		font-size: 16pt;
		font-family: 'Courier New', Courier, monospace;
	}

	h2 {
		font-size: 14pt;
		font-weight: 600;
		font-family: Futura Std;
	}

	p {
		font-size: 11pt;
		display: block;
		margin-block-start: 1em;
		margin-block-end: 1em;
		margin-inline-start: 0px;
		margin-inline-end: 0px;
		unicode-bidi: isolate;
		font-family: Futura std;
	}

	a {
		font-family: 'Courier New', Courier, monospace;
	}

	.faq {
		font-size: 16pt;
	}

	header {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		margin-bottom: 1em;

		.header-container {
			.header-img {	
				display: flex;
				flex-direction: row; 
				align-items: baseline;
				margin-top: 15px;

				img {
					width: 15em;
				}
			}

			.intro {
				display: flex;
				flex-direction: column;
				width: 100%;
				margin-top: 0em;
				margin-bottom: 1em;

				justify-content: center;
				align-items: center;

				.text {
					justify-content: center;
					align-items: center;
					padding-bottom: 0px;
					text-align: center;

					p {
						margin-block-start: 0px;
						margin-block-end: 0px;
					}
				}
			}
		}
	}

	
	.content {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		width: 100%;

		.content-container {
			display: flex;
			justify-content: center;
			align-items: start;
			flex-direction: column;
			width: 75%;

			.issues {
				display: flex;
				justify-content: center;
				align-items: start;
				flex-direction: column;
				width: 65%;
				margin-bottom: 2em;

				.div-issues {
					display: flex;
					flex-direction: column;

					.div-issue {
							padding-bottom: 10px;
					}
				}
			}

			.kontakt {
				display: flex;
				justify-content: center;
				align-items: start;
				flex-direction: column;

				.text {
					width: 50%;
					text-align: start;
					font-family: Futura std;
				}

				.SoMe {
				display: flex;
				align-items: center;
				flex-direction: row;
				margin-top: 1em;
				margin-bottom: 1em;
				padding: 1em;
				background-color: bisque;
				max-width: 250px;

				.text {
					margin-left: 1em;
					justify-content: center;
					align-items: center;
					width: max-content;
				}

					.SoMe-buttons {
						display: flex;
						flex-direction: column;
						justify-content: center;
						align-items: center;

						.SoMe-button img {
							width: 30px;
							margin: 0.5em;
						}
					}
				}	

				.intro {
					margin-top: 1em;
				}
			}

			.vert-container {
				h2 {
					margin-top: 1.5em;
					margin-bottom: 0px;
				}

				p {
					max-width: max-content;
					margin-top: 5px;

					pre {
						max-width: 250px;
					}
				}
			}
		}
	}
	
	footer {
		width: 100%;
		height: max-content;
		color: white;
		background-color: rgb(144, 26, 30);

		display: flex;
		justify-content: center;
		align-items: end;
		flex-direction: row;

		margin-top: 2em;
		padding-top: 3em;
		padding-bottom: 5em;

		.footer-box {
			width: 300px;
		}
	}
}