/* Google Font API */
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@1,300&display=swap');

/* +++++++++++++ Menuleiste Name +++++++++++++ */

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	font-family: Arial;
}

.header {
	text-align: center;
	padding: 32px;
}

.row {
	display: -ms-flexbox;
	/* IE10 */
	display: flex;
	-ms-flex-wrap: wrap;
	/* IE10 */
	flex-wrap: wrap;
	/* left / right border */
	padding: 0 10px;
}

/* Create four equal columns that sits next to each other */
.column {
	-ms-flex: 25%;
	/* IE10 */
	flex: 25%;
	max-width: 25%;
	/* left / right border */
	padding: 0 10px;
}

.column img {
	/* set top and bottom border (= row + column padding) */
	margin-top: 20px;
	vertical-align: middle;
	width: 100%;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 1400px) {
	.column {
		-ms-flex: 50%;
		flex: 50%;
		max-width: 50%;
	}
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
	.column {
		-ms-flex: 100%;
		flex: 100%;
		max-width: 100%;
	}
}

.myblock {
	text-align: justify;
}

.myname {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-size: 2.0em;
	text-align: center;
	color: #000;
	padding: 1% 0% 0% 0%;
	margin-bottom: -10px;
}

.subtitle {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-size: 1.4em;
	/*letter-spacing: 5px;*/
	text-align: center;
	color: #F5B041;
	padding: 0% 0% 1% 0%;
}

.mytext {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-size: 2.0em;
	text-align: none;
	color: #000;
	padding: 1% 0% 0% 0%;
	margin-bottom: -10px;
}

h2 {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-size: 1.2em;
	text-align: none;
	color: #FFF;
	padding: 1% 0% 0% 0%;
	margin-bottom: -10px;
}

.content {
	font-family: 'Lato', sans-serif;
	font-style: normal;
	font-size: 1.0em;
	text-align: none;
	color: #FFF;
	padding: 1% 0% 0% 0%;
	margin-bottom: -10px;
}

#loading_indicator {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	border: 10px solid grey;
	border-radius: 50%;
	border-top: 10px solid rgb(228, 135, 74);
	width: 100px;
	height: 100px;
	animation: spinIndicator 1s linear infinite;
}

@keyframes spinIndicator {
	100% {
		transform: rotate(360deg);
	}
}