/*----------Allgemein----------*/
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html {
	font-size: 20px;
	font-family: ShareTech;
	font-weight: bold;
}

body {
  display: grid;
  grid-template-columns: 7fr 7fr 1fr;
  grid-template-rows: 100px 1fr 500px;
  grid-template-areas:
	"header header header"
	"main main aside"
	"footer footer footer";
}

@font-face {
	font-family: "ShareTech";
	src: url("./../fonts/ShareTech-Regular.ttf") format("truetype");
}

.button {
    background-color: #702250;
    color: #000000;
    border: none;
    padding: 10px 40px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 8px;
    cursor: pointer;
	margin: 20px;
	
}

.button:hover {
    background-color: #000000;
	color: #702250;
}

p {
	color: #ffd800;
	font-size: 1.5rem;
	margin-bottom: 20px;
}

a {
	text-decoration: none;
}

/*----------Kopfzeile----------*/
header {
	grid-area: header;
	background-image: url("./../img/robotarm.jpg");
	display: flex;
	align-items: center;
	padding-left: 50px;
}

h1 {
	color: #72be40;
	font-size: 4rem;
	font-style: italic;
}

/*----------Hauptteil----------*/
main {
	grid-area: main;
	background-image: url("./../img/tech.png");
}

section {
	width: 1fr;
	border: 3px hidden;
	padding: 30px;
	margin: 20px;
	text-align: justify;
}

h2 {
	color: #72be40;
	font-size: 2rem;
	margin-bottom: 20px;
}

ul {
	font-size: 30px;
	list-style-type: "▶ ";
	color: #ffd800;
	margin-left:50px;
}

ul li::marker {
	font-size: 30px;
	color: #702250;
}

h3 {
	color: #ffd800;
	font-size: 3rem;
	margin-top: 50px;
}

h4 {
	color: #702250;
	font-size: 2rem;
}

h5 {
	color: #ffd800;
	font-size: 2rem;
	text-decoration-line: underline;
}

/*----------Randnotiz----------*/
aside {
	grid-area: aside;
	background-color: #702250;
	padding: 20px;
}

img {
	width: 300px;
	margin-top: 100px;
}

.h2-aside {
	color: #000000;
	font-size: 5rem;
	margin-top: 100px;
	margin-bottom: 100px;
}

/*----------Fußzeile----------*/
footer {
	grid-area: footer;
	background-image: url("./../img/robotarm.jpg");
	padding: 60px;
}
