:root {
    font-size: .5rem;
    color:black;
 	font-family: 'Roboto', sans-serif;
	font-kerning: normal;
}
body {margin:0;
background-color:white}

#container {
height:100vh;
width:100vw;
display:grid;
grid-template-columns: 1fr 5fr 1fr;
grid-template-rows: 10vh 1fr 5vh 5vh;
}


#big {grid-column-start:1;
grid-column-end:4;
grid-row-start: 1;
grid-row-end: 5;
z-index: 100;

}

#left {
  grid-column-start:1;
  grid-column-end:2;
  grid-row-start:3;
  grid-row-end:5;
  display:flex;
justify-content:flex-start;
align-items:flex-end;
  transition:.2s;
	z-index: 400;

}

#right {
  grid-row-start:3;
  grid-row-end:5;
  grid-column-start:3;
grid-column-end:3;
  display:flex;
justify-content:flex-end;;
align-items:flex-end;
  transition:.2s;
	z-index: 400;
}

#left:hover, #left:active, #right:hover, #right:active {margin-left:-0,5rem;}

#title {grid-column-start:3;
grid-row-start:1;
grid-column-end:3;
grid-row-end: 2;
align-items:flex-end;
color: black;
font-family: 'Roboto', sans-serif;
font-kerning: normal;
padding: 4pt;
z-index: 300;

}


h6 {margin:auto;
text-align:right;
font-size: 2em;
margin:0;
padding: 0;
	

}

img {max-width:100%;
max-height:100%;}

.mySlides {display:none;
max-height:100%;
width:auto;
margin: 0 auto 0 auto;
}

#text {
    z-index:400;
	width:99vw;	
	position:fixed;
	text-align:left;
	padding:4pt;
}


h2 {
	display: inline;
	padding-top: 1pt;

	
}
a {	color: black;
	vertical-align: top;
	text-decoration: none;
	display: inline;
	font-family: 'Lora', serif;
	font-weight:normal;
	font-size:1em;
 	
	
}


#headline {
	vertical-align: bottom;
	text-decoration: none;
	display: inline;
	font-weight:bold;
	font-size:2em;
	margin: 1pt;
	
}

@media screen and (max-width:1050px){
	
	#text {	
	text-align:center;
	background-color:white;
}
	
#headline {
	font-size:1.6em;
	}
	
	a {	
		font-size:1em;}
	
h6 {margin:0vw;
text-align:center;
font-size: 1.6em;
transform: none;
}
	
 #title {
	 justify-content:center;
	grid-column-start:2;
	 grid-column-end: 2;
	 grid-row-start:4;
	 grid-row-end: 4;
	display: flex}	
	
	#big {grid-column-start:1;
grid-column-end:4;
grid-row-start: 1;
grid-row-end: 3;
z-index: 100;
margin-top: 3vh;
}


#left {
  grid-row-start:4;
  
}

#right {
  grid-row-start:4;
}
	
}
	
