/* * { margin: 0; padding: 0; font-family: Arial, sans-serif; color: #2e2e2e; }
html{  width: 100%; height: 100%; }
body { height: 100%; width: 100%; } */
* { 
    margin: 0; 
    padding: 0; 
    font-family: Arial, sans-serif; 
    color: #2e2e2e; 
}
html, body { 
    width: 100%; 
    height: 100%; 
}
#header, #mobile-header { 
    border-bottom: 1px solid #bebebe; 
    height: 38px; 
    width: 100%; 
    background-color: #e5e5e5; 
    z-index: 1000; 
    position: fixed; 
    top: 0; 
    left: 0;
}
#header2 { 
	height: 38px; 
	width: 100%; 
	z-index: 0; 
}
#mobile-header {
	display: none;
}
#name { float: left; font-family: 'Molengo', arial, serif; font-size: 190%; text-shadow: 1px 1px 0px #f0f0f0; color: #202020; padding-left: 10px;}
#myName { font-family: 'Molengo', arial, serif; font-size: 20px; color: #202020;}
#links { float: right; font-family: 'Cantarell', arial, serif; height: 100%; padding-top:10px; font-size: 125%; letter-spacing: 0.0125em; word-spacing: 0.1em; padding-right: 5px; }
#links a {padding-left: 12px; text-decoration: none; color: #565656; text-shadow: 1px 1px 0px #f0f0f0; }
#links a:hover { color: #767676; text-shadow: 1px 1px 0px #f0f0f0;}
#randTitle {  margin-left: 35%; margin-right: 35%; width: 20%;}
#footer { clear: both; width: 100%; max-width: 800px; margin-left: auto; margin-right: auto; border-top: 1px solid #bebebe; font-family: Arial, sans-serif; font-size: 14px; color:#bebebe;}

#rightMenu { border: 1px solid #bebebe; padding:5px; background-color: #e5e5e5; position: fixed; top: 80px; right: 0px; z-index: 1000; visibility:visible; display:inline; }

#mainBody {
	width: 100%;
	max-width: 800px;
	min-height: 400px; 
	margin: 25px auto; 
}
#intro {height: 130px; font-size: 18px; padding-bottom: 10px; }


#mainBody p { padding-bottom: 10px; }
.mainBody a { padding-left: 2px; padding-right: 2px; }
.mainBody a:hover { color: white; background-color: #2e2e2e; }
#mainBody a { padding-left: 2px; padding-right: 2px; }
#mainBody a:hover { color: white; background-color: #2e2e2e; }
#contactPanel a:hover { color: white; background-color: white; }
#contactPanel { float: right; width: 30px; height: 100%; padding-left: 15px; }
#introold {height: 150px; font-size: 18px; padding-bottom: 10px; border-bottom: 1px solid #bebebe; }
#nametitle { font-family: 'Molengo', arial, serif; font-size: 40px; text-shadow: 1px 1px 1px #aaa; color: black; padding-bottom: 10px;  font-weight: normal;}
.subtitles { font-family: 'Molengo', arial, serif; font-size: 22px; color: #646464; padding-bottom: 10px; font-weight: normal;}
#aboutme {maring-top: 15px;}
#aboutme p {padding-bottom: 20px;}
#news { padding-top: 10px; padding-bottom: 10px; border-top: 1px solid #bebebe; }
#news-items { padding-top: 10px; max-height: 200px; overflow: scroll; }
.news-item { margin-top: 8px; margin-left: 15px; margin-right: 15px; padding: 8px; background-color: #f2f2f2;}
.project {padding-bottom: 20px; }
.project ul {margin-left: 30px; }
.project ul li {padding-bottom: 10px; }
.project ol {margin-left: 35px; }
.project ol li {padding-bottom: 10px; }
h3 {padding-bottom: 10px; font-size: 1.2em; font-weight: bold;}
h4 {font-size: 1.15em; padding-bottom: 5px; }
.special { color: #AA0000; }
.special a { color: #AA0000; }
.author_link a { text-decoration: none; }
.author_link a:hover { text-decoration: underline; color: black; background-color: white;}
.venue_link a { text-decoration: none; }
.venue_link a:hover { text-decoration: underline; color: black; background-color: white;}
.extra_link a { text-decoration: none; font-size: 0.8em; }
.extra_link a:hover { text-decoration: underline; color: black; background-color: white;}

/* .tag_button { border-radius: 10px; border: 1px solid; border-color: #AA0000; padding: 3px; margin-left: 10px; font-size: 14px; cursor: pointer; }  */
.tag_button { border-radius: 10px; border: 1px solid; border-color: #AA0000; padding: 3px; font-size: 14px; cursor: pointer; margin-left: 10px;} 
.tag_button_clicked { background-color: #AA0000; color: white; }
.allAuthors {padding-bottom: 1px;}
.ellipsis {display: none; float: right; margin-top: 1em; font-size:18px;}
.ellipsis:hover {font-weight: bold; cursor: pointer;}
#filter_by_tags { padding-bottom: 15px; width: 100%; }
.tag_button { font-size: 14px; margin-left: 10px; margin-bottom: 3px;  display: inline-block; }

#name-block {
	float: left; 
	text-align: left; 
	padding-top: 40px;
}
#aboutme-header {
	padding-bottom: 15px;
}
#my-photo {
	float: right; 
	margin-top:0px; 
	padding-right: 0px; 
	padding-bottom: 10px; 
	height:175px;
	clip-path: circle(80px at center);
}

@media screen and (max-width: 600px) {
	#rightMenu { display:none; visibility: hidden; }
	/* #header { height: 34px;  }
	#header2 { height: 34px; }
	#name { font-size: 150%; padding-left: 5px; }
	#links { font-size: 100%; padding-top: 5px; padding-right: 5px;} */
	#links a {padding-left: 30px;}
	#mobile-header { display: block; width: 100%; margin: 0px; padding: 0px; }
	#header {display: none; visibility: hidden;}
	#name, #links { font-size: 150%; font-family: 'Cantarell', arial, serif; color: #202020; padding-top: 5px; }
	#name a, #links a { color: #202020; text-decoration: underline; }
	/* #filter_by_tags { display: none; visibility: hidden; } */
	body { width: 98%; }
	#aboutme-header {display: none; visibility: hidden; }
	#nametitle {font-size: 35px;}
	#nameBlock {width: 50%;}
	/* #my-photo {width: 50%;} */
	#mainBody {margin-left: 5px; margin-right: 5px; margin-top: 10px;}
	#aboutme p {font-size: 120%;}
	#intro {display: block; height: 175px; }
	#filter_by_tags {display: block; border-bottom: 1px solid #e5e5e5;}
	.optional_tag_button {display: none;}
	.project ul {padding-top: 5px;}

}