/* prometo */
@font-face {
	font-family: 'prometo';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('https://static.formulastudent.de/dist/prometo/WebStaticFonts/Prometo_W_Rg.woff2') format('woff2');
}
:root {
	color-scheme: light dark;

	--fsg_yellow_gold: 	#FDD315; /* rgb(253,211,21)	*/
	--fsg_red:  		#E40E1B; /* rgb(228,14,27)	*/
	--fsg_black: 		#1D1D1B; /* rgb(29,29,27)	*/
	--fsg_green_cv: 	#76B82A; /* rgb(118,184,42)	*/
	--fsg_yellow_ev: 	#FFDD00; /* rgb(0,136,182)	*/
	--fsg_cyan_dvc:		#0088B6; /* rgb(253,211,21)	*/
	--fsg_cyan_dve:		#5FC4E1; /* rgb(95,196,225)	*/
	--fsg_blue_judge:	#0069B4; /* rgb(0,105,180)	*/
}
@media (prefers-color-scheme: light) {
	:root {
		--text-color:			#2e2f3e;
		--text-h1:				var(--fsg_blue_judge);
		--background-color: 	#f0f0f0;
		--background-color2:	white;
		--background-color3:	lightgray;
	}	
}
@media (prefers-color-scheme: dark) {
	:root {
		--text-color: 			white;
		--text-h1:				var(--fsg_yellow_gold);
		--background-color: 	#26292d;
		--background-color2:	#393e44;
		--background-color3:	var(--fsg_black);
	}
}

*,
*:before,
*:after {
	box-sizing: border-box;
}
body {
	color: var(--text-color);
	background-color: var(--background-color);
	font-family: "Verdana", sans-serif;
    font-size: 0.9em;
	line-height: 1.4;
	display: flex;
	min-height: 100vh;
	flex-direction: column;
	margin: 0;
}
h1 {
	color: var(--text-h1);
	margin: 20px 0 20px 0;
	font-family: prometo, sans-serif;
	font-weight: 400;
	line-height: 1.5;
    font-size: 3em;
    text-align: center;
}
a {
	color: var(--text-h1);
	text-decoration-color: var(--fsg_red,red);
	text-decoration-line: underline;
}
a:hover {
	color: var(--fsg_red,red);
}
#container{
  margin-top: 15px;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#card {
    background-color: var(--background-color2);
    padding: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
#card img {
	width: 300px;
}
div#txt {
    max-width: 750px;	
    margin-bottom: 20px;
    text-align: justify;
    padding: 15px;
}
div#links {
    width: 95%;
    max-width: 750px;
    font-size: 1.3em;
}
#links ul {
	padding:0px;
	margin: 0px;
	list-style-type: none;
	display: flex;
    flex-direction: row;
    justify-content: space-around;
}
#links ul {
	margin: 10px;
}
div#footer {
	background-color: var(--background-color3);
    font-size: 0.8em;
}
#footer ul {
	padding:0px;
	margin: 0px;
	list-style-type: none;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
/*#################
# icons (SVG mask)
#################*/
.icon {
	position: relative;
	padding-left: 1.3em;
	margin-left: 1.5em;
}
.icon::before {
	content: '';
	display: block;
	width: 1em;
	height: 1em;
	position: absolute;
	left: 0;
	top: 0.1em;
	background-color: currentColor;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-size: contain;
	mask-size: contain;
	-webkit-mask-position: center;
	mask-position: center;
}
.icon:hover::before {
	background-color: var(--fsg_red);
}
.user::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M144 128a80 80 0 1 1 160 0 80 80 0 1 1 -160 0zm208 0a128 128 0 1 0 -256 0 128 128 0 1 0 256 0zM48 480c0-70.7 57.3-128 128-128l96 0c70.7 0 128 57.3 128 128l0 8c0 13.3 10.7 24 24 24s24-10.7 24-24l0-8c0-97.2-78.8-176-176-176l-96 0C78.8 304 0 382.8 0 480l0 8c0 13.3 10.7 24 24 24s24-10.7 24-24l0-8z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M144 128a80 80 0 1 1 160 0 80 80 0 1 1 -160 0zm208 0a128 128 0 1 0 -256 0 128 128 0 1 0 256 0zM48 480c0-70.7 57.3-128 128-128l96 0c70.7 0 128 57.3 128 128l0 8c0 13.3 10.7 24 24 24s24-10.7 24-24l0-8c0-97.2-78.8-176-176-176l-96 0C78.8 304 0 382.8 0 480l0 8c0 13.3 10.7 24 24 24s24-10.7 24-24l0-8z'/%3E%3C/svg%3E");
}
.user-cog::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath d='M336.5 128a80 80 0 1 0 -160 0 80 80 0 1 0 160 0zm-208 0a128 128 0 1 1 256 0 128 128 0 1 1 -256 0zm-48 352l0 8c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-8c0-97.2 78.8-176 176-176l79.2 0c-7.4 15.4-8.9 32.3-5.1 48l-74.1 0c-70.7 0-128 57.3-128 128zM432.6 247.6c0-13.3 10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 6.1c0 18.9 24.1 32.8 40.5 23.4l5-2.9c11.6-6.7 26.5-2.6 33 9.1l22.4 40.2c6.2 11.2 2.6 25.2-8.2 32l-4.7 2.9c-16.2 10.1-16.2 39.9 0 50.1l4.6 2.9c10.8 6.8 14.5 20.8 8.3 32L607 483.8c-6.5 11.7-21.4 15.9-33 9.1l-4.9-2.9c-16.4-9.5-40.5 4.5-40.5 23.4l0 6.1c0 13.3-10.7 24-24 24l-48 0c-13.3 0-24-10.7-24-24l0-5.9c0-19-24.2-33-40.7-23.5l-4.8 2.8c-11.6 6.7-26.4 2.6-33-9.1l-22.6-40.4c-6.2-11.2-2.6-25.3 8.3-32.1l4.4-2.7c16.3-10.1 16.3-40.1 0-50.2l-4.5-2.8c-10.9-6.8-14.5-20.9-8.3-32.1l22.5-40.3c6.5-11.7 21.4-15.8 32.9-9.1l4.8 2.8c16.5 9.5 40.7-4.5 40.7-23.5l0-5.9zm99.9 136.2a52 52 0 1 0 -104 0 52 52 0 1 0 104 0z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath d='M336.5 128a80 80 0 1 0 -160 0 80 80 0 1 0 160 0zm-208 0a128 128 0 1 1 256 0 128 128 0 1 1 -256 0zm-48 352l0 8c0 13.3-10.7 24-24 24s-24-10.7-24-24l0-8c0-97.2 78.8-176 176-176l79.2 0c-7.4 15.4-8.9 32.3-5.1 48l-74.1 0c-70.7 0-128 57.3-128 128zM432.6 247.6c0-13.3 10.7-24 24-24l48 0c13.3 0 24 10.7 24 24l0 6.1c0 18.9 24.1 32.8 40.5 23.4l5-2.9c11.6-6.7 26.5-2.6 33 9.1l22.4 40.2c6.2 11.2 2.6 25.2-8.2 32l-4.7 2.9c-16.2 10.1-16.2 39.9 0 50.1l4.6 2.9c10.8 6.8 14.5 20.8 8.3 32L607 483.8c-6.5 11.7-21.4 15.9-33 9.1l-4.9-2.9c-16.4-9.5-40.5 4.5-40.5 23.4l0 6.1c0 13.3-10.7 24-24 24l-48 0c-13.3 0-24-10.7-24-24l0-5.9c0-19-24.2-33-40.7-23.5l-4.8 2.8c-11.6 6.7-26.4 2.6-33-9.1l-22.6-40.4c-6.2-11.2-2.6-25.3 8.3-32.1l4.4-2.7c16.3-10.1 16.3-40.1 0-50.2l-4.5-2.8c-10.9-6.8-14.5-20.9-8.3-32.1l22.5-40.3c6.5-11.7 21.4-15.8 32.9-9.1l4.8 2.8c16.5 9.5 40.7-4.5 40.7-23.5l0-5.9zm99.9 136.2a52 52 0 1 0 -104 0 52 52 0 1 0 104 0z'/%3E%3C/svg%3E");
}
.link-external::before,
.link-external-blank::before {
	width: 0.8em;
	height: 0.8em;
	top: 0.15em;
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M288 24c0 13.3 10.7 24 24 24l118.1 0-231 231c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l231-231 0 118.1c0 13.3 10.7 24 24 24s24-10.7 24-24l0-176c0-13.3-10.7-24-24-24L312 0c-13.3 0-24 10.7-24 24zM80 96C35.8 96 0 131.8 0 176L0 432c0 44.2 35.8 80 80 80l256 0c44.2 0 80-35.8 80-80l0-88c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 88c0 17.7-14.3 32-32 32L80 464c-17.7 0-32-14.3-32-32l0-256c0-17.7 14.3-32 32-32l88 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L80 96z'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M288 24c0 13.3 10.7 24 24 24l118.1 0-231 231c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l231-231 0 118.1c0 13.3 10.7 24 24 24s24-10.7 24-24l0-176c0-13.3-10.7-24-24-24L312 0c-13.3 0-24 10.7-24 24zM80 96C35.8 96 0 131.8 0 176L0 432c0 44.2 35.8 80 80 80l256 0c44.2 0 80-35.8 80-80l0-88c0-13.3-10.7-24-24-24s-24 10.7-24 24l0 88c0 17.7-14.3 32-32 32L80 464c-17.7 0-32-14.3-32-32l0-256c0-17.7 14.3-32 32-32l88 0c13.3 0 24-10.7 24-24s-10.7-24-24-24L80 96z'/%3E%3C/svg%3E");
}

@media only screen and (max-width:800px) {
	.duotone {
		margin-left: 0em;
	}
	#card {
		width: 100%;
	}
	#container {
    	margin-top: 0px;
	}
}
@media only screen and (max-width:600px) {
	h1 {
		line-height: 1.2;
    	font-size: 7.5vw;
    }
}
@media only screen and (max-width:460px) {
    #card img {
    	width: 70%;
    }
    div#txt {
    	padding: 0px; 
	}
}
