body
	{	
	color:#000000;
	background-color:#FFFFFF;
	font-family: "Poppins", Sans;
	font-size: 14pt;
	margin: 0;
  	height: 100%;
	}

	* {
  	font-family: 'Poppins', Serif;
  	box-sizing: border-box;
	}

a
	{
	color:#000000;
	text-decoration:none;
	font-family: 'Roboto', Sans;
	}
a:visited
	{
	color:#000000;
	}

img	{
	border:0;
	}

#sociallinks
	{
	position:absolute;
	left:12px;
	top:10px;
	}

.socialsvg
	{
	padding:10px;
	height:50px;
	}

.socialsvg path {
  fill: #eee;
  transition: fill 0.2s ease;
}

.socialsvg:hover path {
	  fill: #2d2e35;
}

.socialsvg_profile
	{
	padding:5px;
	height:40px;
	}

.socialsvg_profile path {
  fill: #bbb;
  transition: fill 0.2s ease;
}

.socialsvg_profile:hover path {
  	fill: #124607;
}

#publiwrapper
	{
	width:70%;
	padding:20px;
	}

#publiwrapper h1
	{
	font-size:2em !important;
	}

#publiwrapper h2
	{
	font-size:1.8em !important;
	text-align:left;
	line-height:1.3em !important;
	}

.pub-table-container {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.pub-table {
  font-size:0.8em;
  width: 100%;
  border-collapse: collapse;
  font-family: system-ui, sans-serif;
}

.pub-table th,
.pub-table td {
  text-align: left;
  padding: 0.75em 1em;
  border-bottom: 1px solid #ddd;
}

.pub-table th {
  background: #f7f7f7;
  font-weight: 600;
}

td[data-label="Journal / Verlag"] {
  font-style: italic;
}

td[data-label="Name"] {
  font-weight:bold;
}

#projectwrapper
	{
	font-size:80%;
	text-align:left;
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	}

.projectthumb
	{
	max-height:100px;
	}

.projectdesc
	{
	padding:20px;
	line-height:1.3em;
	}



#topnavbox
	{
	background:rgba(18,70,7,0.6);
	position:fixed;
	top:0;
	width:100%;
	transition: top 0.5s;
	}

.top-nav {
	display: flex;
  	flex-direction: row;
  	align-items: center;
  	justify-content: space-between;
   	height: 70px;
  	padding: 1em;
	}

.menu {
  	display: flex;
	justify:
  	flex-direction: row;
  	list-style-type: none;
  	margin: 0;
  	padding: 0;
	height:1.5em;
	}

.menu a
	{
	font-size:80%;
	font-weight:400;
	color:#fff;
	}

.menu a:hover
	{
	color:#2d2e35;
	}

.menu > li {
  	margin: 0 1rem;
  	overflow: hidden;
	}

.menu-button-container 
	{
  	display: none;
  	height: 100%;
  	width: 30px;
  	cursor: pointer;
  	flex-direction: column;
  	justify-content: center;
  	align-items: center;
	}

#menu-toggle 
	{
  	display: none;
	}

.menu-button,
.menu-button::before,
.menu-button::after 
	{
  display: block;
  background-color: #ffffff;
  position: absolute;
  height: 4px;
  width: 30px;
  transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1);
  border-radius: 2px;
}

.menu-button::before {
  content: '';
  margin-top: -8px;
}

.menu-button::after {
  content: '';
  margin-top: 8px;
}

#menu-toggle:checked + .menu-button-container .menu-button::before {
  margin-top: 0px;
  transform: rotate(405deg);
}

#menu-toggle:checked + .menu-button-container .menu-button {
  background: rgba(255, 255, 255, 0);
}

#menu-toggle:checked + .menu-button-container .menu-button::after {
  margin-top: 0px;
  transform: rotate(-405deg);
}

p
	{
	font-family:'Poppins', Sans-Serif;
	line-height:1.5em;
	}

h1
	{
	padding:0px;
	color:#124607;
	line-height:1em;
	font-family:"Roboto",Sans-Serif;
	font-size:140%;
	margin-top: -5px;
	}

h1 i
	{
	font-weight:300;
	font-style:italic;
	font-family:"Roboto", Sans-Serif;
	text-decoration:none;
	}

h1 a
	{
	color:#124607;
	font-weight:300;
	font-family:"Roboto", Sans-Serif;
	text-decoration:underline;
	}

h2
	{
	color:#124607;
	font-family:"Roboto", Sans-Serif;
	font-size:2em;
	font-weight:300;
	line-height:0.5em;
	}

h2 a
	{
	color:#124607;
	font-family:'Roboto', Sans-Serif;
	font-weight:300;
	line-height:0.5em;
	}



.minibiotext
	{
width:80%;
font-size:1.5em;
font-weight:200;
	}


.profile
	{
	height:230px;
	width:230px;
	object-fit:cover;
	border-radius:130px;
	padding:10px;
	}

#musiclinkbox
	{
	justify-content:center;
	width:40%;
	display:flex;
	flex-direction:column;
	font-family:'Noto Sans';
	gap:15px;
	}

.musiclink
	{
	height:60px;
	position:static;
	background:rgba(255,255,255,0.6);
	}

.musiclink a
	{
	color:black;
	}

.musiclink a:hover
	{
	color:#336699;
	background:rgba(255,255,255,0.3);
	}


.musiclink a:active
	{
	color:white;
	background:rgba(255,255,255,0.3);
	}

.filluptheboxlink
	{
	display:flex;
	align-items:center;
	justify-content:center;
	height:100%;
	width:100%;
	z-index:1;
	}


#mainpagewrapper
	{
	height:100%;
	width:100%;
	display:block;
	padding:150px;
	}

#profilewrapper
	{
	width:70%;
	display:flex;
	flex-direction:row;
	padding:20px;
	}

#profileleft
	{
	padding:10px;
	min-width:40%;
	}

#profileright
	{
	padding:5px;
	text-align:left;
	hyphens:auto;
	}

#profileright p, #profileright li
	{
	font-size:95%;
	font-family:'Poppins',Sans-Serif;
	}

#contactwrapper
	{
	width:50%;
	height:100%;
	padding:10px;
	}

.contactiframe
	{
	height:100%;
	min-height:550px;
	}


#listwrapper
	{
	padding:0px 30px 30px 30px;
	text-align:justify;
	width:50%;
	min-width:250px;
	display:block;
	}


#listwrapper iframe
	{
	height:auto;
	min-height:250px;
	}


span.required, div.required
	{
	color:red;
	}

.copyright
	{
	font-family:'noto sans', sans;
	font-size:80%;
	color:#2d2e35;
	display:inline-block;
	max-width:95%;
	}

.copyright a
	{
	text-decoration:underline;
	}

#ccicons
	{
	height:20px;
	}

.ccicon
	{
	width:40px;
	height:40px;
	fill:#2d2e35;
	}
.tinybottommenu
	{
	color:#8D867B;
	font-family:"noto sans", sans;
	font-size:60%;
	padding-top:30px;
	}

.tinybottommenu a
	{
	padding:15px 8px 15px 9px;
	}
	
.bottomsocial
	{
	display:flex;
	justify-content:center;	
	}
.bottomsocial img
	{
	padding:10px 20px 10px 20px;	
	}

@media screen and (max-width:1200px) 
{
	.biotext, .contacttext .minibiotext
		{
		padding: 20px;
		min-width:250px;
		font-size:140%;
		}
	.bioquotes
		{
		font-size:130%;
		}
		
	.disco_row
		{
		flex-direction:column;
		}

	#listwrapper
		{
		padding: 0px 15px 15px 15px;
		text-align:justify;
		width:90%;
		min-width:250px;
		font-size:100%;
		color:emerald;
		display:block;
		}
	
	#contactwrapper
		{
		width:90%;
		}
	#mainpagewrapper
		{
		padding:100px;
		}
	#profilewrapper
		{
		width:85%;
		}
	
	@media screen and (max-width:940px) 
		{
		#sociallinks
			{
			position:relative;
			margin-top:-3em;
			}
		h2
			{
			font-size:1.8em;
			}
		.disco_item
			{
			flex-direction:column;
			}
		.disco_links
			{
			gap:0.8em;
			}
		#musiclinkbox
			{
			width:70%;
			}

			.menu-button-container
			{
   			 display: flex;
 			}
 		.menu 
			{
			position: absolute;
    			top: 0;
    			margin-top:70px;
			left: 0;
			flex-direction: column;
			width: 100%;
			height:100%;
			}
		.menu a
			{
			color:#ffffff;
			font-size:18pt;
			padding:12px;
			}
  		#menu-toggle ~ .menu li 
			{
    			height: 0;
    			margin: 0;
   			padding: 0;
    			border: 0;
			opacity:0;
			z-index:-1;
			position:static;
			transition: opacity 500ms cubic-bezier(0.23, 1, 0.32, 1);
			}
  		#menu-toggle:checked ~ .menu li 
			{
    			border: 2px solid #71906a;
    			height: 100%;
    			padding: 0;
			align-items:center;
			opacity:1;
			z-index:10;
			transition: opacity 500ms cubic-bezier(0.23, 1, 0.32, 1);
			}
		
		#menu-toggle:checked ~ .menu
			{
			position:fixed;
			}

		.menu > li 
			{
			display: flex;
    			justify-content: center;
			margin: 0;
    			padding: 0.5em 0;
    			width: 100%;
    			color: white;
			background:#71906a;
  			}
  		.menu > li:not(:last-child)
			{
    			border-bottom: 1px solid #444;
			align-items:top;
  			}
		
		#sociallinks img
			{
			padding:20 20 30 20;
			margin-top:-70px;
			}

		#biopic
			{
			width:30%;
			}


		#profilewrapper
			{
			width:100%;
			display:flex;
			flex-direction:column;
			}
		.pub-table thead {
 			display: none;
 			}
 		.pub-table tr {
     			display: block;
     			margin-bottom: 1.5em;
     			border: 1px solid #eee;
     			border-radius: 8px;
     			box-shadow: 0 2px 4px rgba(0,0,0,0.05);
     			padding: 0.5em 0.75em;
     			}
     		.pub-table td {
     			display: block;
     			border: none;
     			padding: 0.3em 0;
     			}
     		.pub-table td::before {
     			content: attr(data-label);
     			display: block;
     			font-weight: bold;
     			color: #555;
     			margin-bottom: 0.2em;
       			}
		
		@media screen and (max-width:480px) 
			{
		
			#mainpagewrapper
				{
				padding:3px;
				margin-top:50px;
				}
			#musiclinkbox
				{
				width:90%;
				}
			.greetingtext
				{
				width:80%;
				font-size:180%;
				padding:10px;
				}
			#greetingscreen img
				{
				width:100%;
				}
			.top-nav
				{
				height:50px;
				}
			.menu
				{
				margin-top: 50px;
				}
			#sociallinks img
				{
				//padding:20px;
				margin-top:-50px;
				}

			.onpagenow
				{
				height:90%;
				max-height:60px;
				margin:1px 3px -5px;
				}
    				
			#biopic
				{
				width:50%;
				}


			}
		}
}