html {
	background-color: #eee;
}

@font-face {
    font-family: 'LiterataLight'; 
    src: url('Literata-Light.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}


body {
	/* background-color: #fff; */
	margin: 0 auto;
	margin-top:15px;
	margin-bottom:15px;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	border-bottom-left-radius: 0.5rem;
	border-bottom-right-radius: 0.5rem;
	/* font-family: HelveticaNeueW01-45Ligh,"Helvetica Neue",HelveticaNeue,Helvetica,sans-serif; */
	font-family: 'LiterataLight',serif;
	padding: 2rem;
	max-width: 900px;
	font-size: 1.05em;
	font-weight: 400;
	font-style:normal;
	color:#362f27;
	/* -moz-box-shadow: 1px 2px 4px rgba(0, 0, 0,0.5);
	-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
	box-shadow: 1px 2px 4px rgba(0, 0, 0, .5); */
	  
}

p {
  line-height: 1.3;
}

li {
  line-height: 1.3;
}

.blog {
	font-family: Georgia, serif;
	padding: 5rem;
	font-weight: 200;
	font-size: 20px;
	color:#121212;
}

#face {
	padding: 5px;
	float: left; 
	margin: 0px 15px 15px 0px; 
	width: 40%; 
	display: block;
	/*-moz-box-shadow: 1px 2px 4px rgba(0, 0, 0,0.5);
	-webkit-box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
	box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);*/
}


#myname {
	font-size: 600%;
	font-size: 8vw;
	font-weight: 200;
	font-family: helvetica neue;
	font-weight: lighter;
}

.main{
	padding-top: 20px;
}

.caption {
	font-size: 75%;
	text-align: center;
}

h1 {
    font-weight: normal;
    font-size: 30;
  }

h2 {
    padding-top: 40px;
		font-weight: normal;
		font-size: 25;
	}

h2:after {
    content:' ';
    display:block;
    border:2px solid #d0d0d0;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
    -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
    -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
}


.copyright {
	padding: 6px 8px 6px 8px;
	color: #818181;
	width: 100%;
	font-size: 12px;
  text-align: center;
}



.sidenav {
  width: 98%; 
  text-align: center;
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  /*background-color: #eee; /* Black */
  /*padding-top: 15px;*/
  /*padding-bottom: 15px;
  padding-left:15px;
  padding-right:15px;*/
  margin-bottom:15px;
  line-height: 1.5;
}

/*.sidenav:after{
	margin-top:15px;
	content:' ';
    display:block;
    border:2px solid #d0d0d0;
    border-radius:4px;
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
    -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
    -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);	
}
*/


.mediaimg {
	width: 2em; 
	height: 2em;
	transition: opacity .3s ease-in-out;
	padding-left: .5em;
	padding-right: .5em;
}

img.top {
	position: absolute;
}

img.top:hover {
	opacity:0;
}

.news {
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 15px;
	vertical-align: top;
	line-height: 125%;
}

.date {
	font-weight: bold;
	min-width: 15%;
}

a{color:#B51700;outline-color:#B51700;-webkit-transition:color 400ms;-o-transition:color 400ms;transition:color 400ms;text-decoration:none;cursor:pointer}
a:focus,a:hover{color:#640d00}

.publication {
	padding-left: 15px;
	padding-right: 15px;
	padding-bottom: 15px;
}

.title {
	font-weight: bold;
}
.authors {
	font-size: 75%;
	margin-bottom: 10px;
}
.summary {
	line-height: 125%;
	margin-bottom:10px;
}

.publication:after{
	margin-top:15px;
	margin-left:25%;
	margin-right:25%;
	width:50%;
	content:' ';
    display:block;
    border:1px solid #d0d0d0;
    border-radius:1px;
    -webkit-border-radius:1px;
    -moz-border-radius:1px;
    box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
    -webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);
    -moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, .05);	
}

li.socials {
    display: inline;
	padding-right: 1em;
	float:right;
	transition: transform .2s;
	margin: auto 0;
}

.socials:hover {
	transform: scale(1.2);
}

ul.social-bar {
	display:flex;
	justify-content:space-around; 
    list-style-type:none;
	padding:0;
	margin: 0 auto;
	width:50%;
}

#footer { overflow: hidden; 
	position:fixed; 
	padding-bottom: 20px;
	padding-top: 25px;
	bottom: 0px;	
	left:25px; 
	z-index: 9; 
	width: 100%; 
	height: 35px;
	background-color: #ffffff; }

html{font-size:100%;}
@media(max-width:40em){
	html{font-size: 100%}
	#myname{font-weight: 350;}
	#face{width:100%;}
	body{padding:1rem;
		margin-top:0;
		margin-bottom:0;}
	.blog{
		padding:1rem;
	}
	}
