/* PORTFOLIO: */
* {
	text-decoration: none; /* Unterstreichung entfernen */
}

#portfolio { /* Abstände, Ausrichtung, etc. definieren */
   	width: 90%;
   	height: 100%;
   	margin-left: auto;
   	margin-right: auto;
    font-family: 'arca-majora2-heavy', 'verdana', 'sans-serif'; /* Schriftart */
}

/* "Flexbox" - zur Anordnung der Portfolio-Bilder */

.portfolio-gruppe { /* ganzer Block mit allen Projekten */
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.portfolio-projekt { /* einzelne Projekte */
	width: 300px; /* Bildgröße - wie echt */
	height: 300px; /* Bildgröße - wie echt */
	margin: 25px; /* Abstand ums Bild auf allen Seiten */
}

.portfolio-projekt p { /* Beschriftung Portfoliobilder */
	position: relative;
	bottom: 50px; /* Abstand der Schrift von unten */
	text-align: right; /* Text-Ausrichtung */
	right: 15px; /* Abstand von rechts */
	color: #ffffff;  /* Textfarbe (#FFFFFF = weiß) */
	margin: 0;
	font-size: 18px; /* Schriftgröße - festgelegt für ältere Browser */
	font-size: 1.5rem; /* Schriftgröße - relativ. 1rem = Standardschriftgröße des Browsers (i. d. R. 16px), sofern im Elternelement für Schriftgröße 100% eingestellt ist */
}

/* Einbindung der Schrift */

@font-face { /* einbinden einer eigenen Schrift */
  	font-family: 'arca-majora2-heavy'; /* Name der Schrift */
  	src: url('schriften/arcamajora2_heavy_webfont.eot#') format('eot'),
    	 url('schriften/arcamajora2_heavy_webfont.woff') format('woff'),
         url('schriften/arcamajora2_heavy_webfont.woff2') format('woff2'),
         url('schriften/arcamajora2_heavy_webfont.ttf') format('truetype'),
         url('schriften/arcamajora2_heavy_webfont.svg#arca-majora2-heavy') format('svg'); /* Links zu den Schrift-Dateien in verschiedenen Formaten. Nach der eot steht ein #, so daß der Internet-Explorer nur dieses Format ließt und nicht weiter ließt. */
}

/* alternative Schriftfarben (Standard ist oben weiß eingestellt. Je nach Hintergrund gehen hier andere... */

#hocker {
}

#rollotisch {
	color: #808080; /* #808080 = grey */
}

#zeitmaschin {
}

