@font-face { font-family: KoHoB;	src: url(fonts/KoHo-Bold.ttf); }
@font-face { font-family: KoHoL;	src: url(fonts/KoHo-ExtraLight.ttf); }
@font-face { font-family: KoHoLI;	src: url(fonts/KoHo-ExtraLightItalic.ttf); }
@font-face { font-family: KoHoI;	src: url(fonts/KoHo-Italic.ttf); }
@font-face { font-family: KoHoR;	src: url(fonts/KoHo-Regular.ttf); }
@font-face { font-family: PatrickHand;	src: url(fonts/PatrickHand-Regular.ttf); }


* { margin:0; padding:0; font-family:KohoR, Arial, Helvetica, sans-serif; color:#36363b; }
div { display:inline-block; float:left;  }
.clear { clear:both; display:block; }

.showforsmall { display:none; }
.hideforsmall { display:inline-block; }

@media screen and (max-width: 560px) {
 	.showforsmall { display:inline-block; }
	.hideforsmall { display:none; }
}

.abovegrey { display:inline-block;  }
.abovepic { display:none; }

@media screen and (max-width: 560px) {
 	.abovegrey { display:none;  }
	.abovepic { display:inline-block; }
}


.shadow {
  -webkit-filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
  filter: drop-shadow( 3px 3px 2px rgba(0, 0, 0, .7));
  /* Similar syntax to box-shadow */
}

.buzz-wrap .item .detailpane {}

body.startpage .viewport { 
	width:100vw;
	height:100vh;
	/*background:url(../img/eric_lechner.jpg) left bottom no-repeat rgba(169,174,180,1); */
	background:url(../img/eric_lechner_sw.jpg) left bottom no-repeat rgba(173,173,173,1);
	background-size:80vh;
}

.signature-wrap { 
	max-width:100%;
	margin-top:20vh;
	margin-left:20px;
}

@media screen and (max-width: 560px) {
 	.signature-wrap { 
		max-width:100%;
		margin-top:14vh;
		margin-left:10px;
	}
}


.signature-wrap img {
	width:100%;
}

.buzz-wrap { 
	/*float:right;
	margin:10vh 1vw 0 0;*/
	position:absolute;
    bottom:5vh;
    right:5vw;	
	max-height:100vh;
}

@media screen and (max-width: 560px) {
 	.buzz-wrap {
		left:5vw;
	}
}


.buzz-wrap .item { 
	width:50vw; 
	display:block; 
	clear:both; 
}

.buzz-wrap .item img { 
	width:100%; 
	max-height:30vh;
} 

.buzz-wrap.abovepic .detailpane {
	padding:1em;
	background:url(../img/bg_pattern_tile_2x2_white.png) repeat;
}

.buzz-wrap .detailpane h1 {
	/* font-family:KoHoB, Arial, Helvetica, sans-serif; */
	font-family:KoHoR, Arial, Helvetica, sans-serif;
	font-weight:normal;
	font-size:1em;
	line-height:0.8em;
	margin:0 0 0.3em 0;
}

.buzz-wrap .detailpane p {
	font-family:KoHoR, Arial, Helvetica, sans-serif;
	font-size:1em;
	line-height:0.8em;
}

div.links a {
	text-decoration:none;
	color:#476889;
}


.metanav { margin:1em 0 0 1em; }
.metanav .navp { margin:0 0.5em 0 0; }

.metanav .navp a {
	font-family:KoHoL;
	color:#f0f4f7;
	font-size:0.9em;
	text-decoration:none;
}

.metanav .navp a:hover { 
	font-family:KoHoB;
	color:rgba(56,132,170,1);
}

.metanav .navp a:active { 
	font-family:KoHoB;
	color:rgba(89,151,179,1);
}