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

#portfolio { /* Abstände, Ausrichtung, etc. definieren */
   	width: 90%;
   	margin-left: auto;
   	margin-right: auto;
  	margin-bottom: 20px; /* Abstand unter Portfolio - nötig, weil sich sonst der Footer mit dem Portfolio überlagert */
    font-family: 'arca-majora2-heavy', 'verdana', 'sans-serif'; /* Schriftart */
    /* background: yellow; */
}

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

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

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

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

.portfolio-projekt p:hover { /* Schriftfarbenänderung bei Mouseover */
   color: #800000; /* Vorschläge: ccffcc - cc0033 - red - 33ccff*/
}

footer { /* betrifft den Footer */
    background: black; */
    padding-top: 50px;
}

/* .portfolio-projekt img:hover{
	border: 3px solid #48D1CC; /* /* Macht bei Mouseover über Bild einen bunten Rahmen um das Bild. Funktioniert aber nicht gut, weil das Bild dann um die Rahmenbreite zur Seite springt*/ 

/* Schrift */

@font-face { /* einbinden einer eigenen Schrift */
font-family: 'genome-thin'; /* Name der Schrift */
src: url(schriften/genome-thin.otf); /* Link zur 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... */

#layout1 {
}

#layout2 {
}

#layout3 {
}