/*erstes Layout inklusive Flexfkt*/

.personalPageContainer-LM { 
  height:100vh;
  margin-bottom: 1em;
  display: grid; 
  grid-template-rows: 400px 400px;
  grid-template-columns: 35% 35% 30%;
  grid-template-areas:
    "infoBox1-LM infoBox2-LM contactHeader-LM" 
    "infoBox3-LM infoBox4-LM contactHeader-LM" 
/*    "infoBox3-LM infoBox3-LM contactHeader-LM" */
  ; 
}
.contactHeader-LM { 
  grid-area: contactHeader-LM;
  display: flex;
  flex-direction: column;
  background-color: rgba(238, 238, 238, 0.5);
  /*border: 0.5px solid #007576;*/
  /*border-radius: 5px;*/
  margin: 1em 0em 1em 0.5em;
  align-items: center;
}
/*ContactBox*/
.contactHeader-LM > div {
	z-index: 1;
	padding: 0.5em;
}
.contactGreenBox-LM { 
  /*background-color: rgba(0, 117, 118, 0.5);*/
  border-radius: 2px;
}
.portraitName-LM img{
  border-radius: 100%;
  width: 180px;
  height: 180px;
  }

.lineHeight125-LM {
	line-height: 125%;
}
.margin-normal-LM{
	margin: 1.5em;
}
.margin-1em-2em-LM{
	margin: 1em 2.5em;
}
.margin-1em-LM{
	margin: 1em;
}
.margin-08em-LM{
	margin: 0.8em;
}
.margin-05em-LM{
	margin: 0.5em;
}
.margin-small-LM {
	margin: 0em 1.5em 0em;
}
.margin-small1-LM {
	margin: 0.3em 1.5em 0.3em;
}
.MarginTop-LM > div {
	margin-top: 150px;
}
.background-05Grey-LM {
	background-color: rgba(250, 245, 240, 0.5);
}

/*infobox*/

.infoBoxCommon-LM {
	display: flex;
	flex-direction: column;
	/*background-color: #fafafa;
	box-shadow: 8px 8px 4px #a9a9a9;*/
	margin: 1em 0.5em -1.3em;
	padding: 0.5em;
}
.infoBoxCommon-LM > div {
	z-index: 1;
	padding: 0.5em;
	margin: 0.8em 0em;
	justify-self: left;
}

.infoBoxImage-LM img{
  display: block;
  margin-left: auto;
  margin-right: auto;
  /*max-width: 200px;*/
  height: 145px;
  z-index: 2;
  box-shadow: 1px 1px 1px 0px rgba(227,227,227,0.75);
  }
  
.infoBoxHeaderGreen-LM > p{
	color: #007576;
	text-decoration: underline;
}

.sourceInfoBoxCommonTop-LM {
	align-self: end;
	justify-self: start;
	margin: 0.5em 1.5em 0.5em;
}
.sourceInfoBoxCommonBottom-LM {
	align-self: end;
	justify-self: start;
	margin: 0.5em 1.5em 1em;
	padding: 0.5em 0em 0.5em;
}
.infoBoxBorderline-LM {
	border-bottom: 0.5px solid #e3e3e3;
}
.infoBox1-LM { 
  grid-area: infoBox1-LM;
}
.infoBox2-LM { 
  grid-area: infoBox2-LM;
  /*background-color: #e3e3e3;*/
} 
.infoBox3-LM { 
  grid-area: infoBox3-LM;
  margin-bottom: 1em;
}
.infoBox4-LM { 
  grid-area: infoBox4-LM;
  margin-bottom: 1em;
} 

/* weiterführende Seiten*/
.contactBioCompleteBox-LM {
	font-style:italic; 
	/*border:2px solid #E5E5E5; 
	border-radius:2px; */
	color:#00aa00; 
	width:90%; 
	background-color:#f9f9f9; 
	margin:2em 1em;
	padding: 2em;
}
.publicationOverviewBox-LM { 
	/*border: 2px solid #E5E5E5;
	border-radius: 2px; */
	color: #00aa00; 
	width: 90%; 
	background-color: #EBF5FB;
	margin: 2em 1em;
	padding: 2em;
}
.unvisibleBox-LM { 
  margin: 1em;
  border-radius: 2px;
}
.smallMarginBottom-LM {
	margin-bottom: 1em;
}
.1em-Padding-1-1-0-LM {
	padding: 1em 1em 0em;
}
.05em-PaddingTop-LM {
	padding: 0.5em 0em 0em;
}
.FlexboxProject-LM {
	display: flex;
	width: 95%;
	flex-direction: column;
}
.FlexboxProject-LM  > div{
	margin: 0.8em 0em;
}
.Padding05em-LM > div{
	padding: 0.5em;
}
.Padding08em-LM > div{
	padding: 0.8em;
}
.Padding1em-LM > div{
	padding: 1em;
}
.Padding1em2-LM {
	padding: 1em;
}
.blackbox-LM {
	background-color: black;
	color: white;
}
.whitebox-LM {
	background-color: white;
}
.border-LM {
	border: 0.5px solid #0d6d66;
}
.image100-LM img{
	max-width: 100%;
}
.RiskKan-LM {
	Font-size: 50px;
}
.Flexbox-Row-LM {
	display: flex;
	flex-direction: row;
}
.vertical-center-LM {
	align-items: center;
	justify-content: center;
}
.justify-hyphens-LM {
	hyphens: auto; 
	text-align: justify;
}
.height200px-LM {
	height: 200px;
}
.height225px-LM {
	height: 250px;
}
.height25px-LM {
	height: 25px;
}
.height150px-LM {
	height: 150px;
}
.MediaBox-LM {
	font-style: italic;
	border: 2px solid #E5E5E5;
	width: 90%; 
	background-color: rgba(250, 245, 240, 0.5);
	margin: 2em;
}
/*image grayscale_hover BGI group image*/
.img-hover-colorize-LM img {
	transition: transform .5s, filter 1.5s ease-in-out;
	filter: grayscale(100%);
}

.img-hover-colorize-LM:hover img {
	filter: grayscale(0);
	/*transform: scale(1.1);*/
}
.tablespace-lm td,tr {
	padding-bottom: 1em;
}

/*@media tablet*/
@media all and (max-width: 40em) {
	.personalPageContainer-LM {
		height:425vh; 
		display: grid; 
		grid-template-rows: 800px 400px 400px 400px 400px; 
		grid-template-columns: 100%;
		grid-template-areas:  
			"contactHeader-LM"
			"infoBox2-LM"
			"infoBox1-LM"
			"infoBox3-LM"
			"infoBox4-LM"
		; 
	}
	.contactHeader-LM { 
		margin: 0.5em 0em 0.5em 0.5em;
	}
	.contactBioCompleteBox-LM2 {
		margin:1em;
		padding: 0.5em;
		width:80%;
	}
	.publicationOverviewBox-LM2 { 
		margin: 0.5em;
		padding: 0.5em;
		width:80%;
	}
	.infoBoxCommon-LM {
		border-bottom: 0.5px solid #e3e3e3;
		margin: 1em 0.5em -0.8em;
	}
	.infoBoxImage-LM img{
		max-width: 180px;
		max-height: 180px;
	}
	.infoBoxCommon-LM > div {
		margin: 0.5em 0em;
		justify-self: left;
	}
	.FlexboxProject-LM  div{
		display: block;
		}
	.FlexboxProject-LM img{
		max-width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
		}
	.Margin-left50px-LM {
		margin-left: 50px;
	}
	.Margin-left-LM {
		margin-left: 100px;
	}
	.MarginTop-LM > div {
		margin-top: 80px;
	}
	.RiskKan-LM {
		Font-size: 30px;
	}
	.height200px-LM, .height225px-LM, .height150px-LM {
		height: 100%;
	}
	.Flexbox-Row-LM {
		flex-direction: column;
	}
	.Flexbox-Row-LM > div{
		margin: 0.5em;
	}
}
@media all and (min-width: 40em) and (max-width: 70em) {
	.personalPageContainer-LM {
		height:425vh; 
		display: grid; 
		grid-template-rows: 800px 400px 400px 400px 400px; 
		grid-template-columns: 100%;
		grid-template-areas:  
			"contactHeader-LM"
			"infoBox2-LM"
			"infoBox1-LM"
			"infoBox3-LM"
			"infoBox4-LM"
		; 
		}
	.contactHeader-LM { 
		margin: 0.5em 0em 0.5em 0.5em;
	}
	.contactBioCompleteBox-LM2 {
		margin:0.5em;
		padding: 0.5em;
	}
	.publicationOverviewBox-LM2 { 
		margin: 1em;
		padding: 0.5em;
	}
	.infoBoxCommon-LM {
		border-bottom: 0.5px solid #e3e3e3;
		margin: 1em 0.5em -0.8em;
	}
	.infoBoxCommon-LM > div {
		margin: 0.5em 0em;
		justify-self: left;
	}
	.FlexboxProject-LM  div{
		display: block;
	}
	.FlexboxProject-LM img{
		max-width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	.Margin-left-LM {
		margin-left: 100px;
	}
	.MarginTop-LM > div {
		margin-top: 80px;
	}
	.RiskKan-LM {
		Font-size: 30px;
	}
	.height200px-LM, .height225px-LM, .height150px-LM {
		height: 100%;
	}
}