html, body{
	width:100vw;
	height:100vh;
	/*min-width: 370px;*/
	overflow-x: hidden;
}

/* ------------------------------- */
/* index */
/* ------------------------------- */

#overview {
	width: calc(80vw - 120px);
	margin:70px 0 70px 40px;
}
#overview .featured {
	width: 50%;
	margin-right:-15px;
}

/* ------------------------------- */
/* header */
/* ------------------------------- */

header{
	padding:8px 40px;
}
header .name{
	padding-left:40px;
}
header .post-title{
	clear: left;
	padding-left:40px;
	max-width: 180px;
    word-break: normal;
}
header.donker .icon,
header .icon{
}
header .next{
	top:2em;
}

/* ------------------------------- */
/* zone - project view */
/* ------------------------------- */

/* small */
#zone.small .post video{
	width: auto;
	max-width: calc(100% - 120px);
	max-height: none;
	height: auto;
	margin:0 auto;
}
/* middle + overflow + full */
#zone.middle .post video,
#zone.overflow .post video,
#zone.full .post video{
	width: auto;
	max-width: calc(100% - 70px);
	max-height: none;
	height: auto;
	margin:0 auto;
}
#zone.full .post figcaption{
	bottom:20px;
}
#zone .post figcaption{
	font-size: 12px;
}

/* ------------------------------- */
/* panel */
/* ------------------------------- */

#panel-wrapper .panel{
	width:calc(100% - 30px);
	padding:10px 15px 50px;
}
#panel-wrapper .panel #post-description,
#panel-wrapper .panel #project-description{
	width: calc(100% - 30px);
	margin:0 auto;
}
#panel-wrapper .panel #post-links{
	margin-left:40px;
}

/* ------------------------------- */
/* info + news page */
/* ------------------------------- */

.page .content-wrapper{
	width: calc(100% - 80px);
	margin:100px auto 0;
	font-size:95%;
}
.page h1,
.page h2,
.page h3,
.page h4,
.page h5,
.page h6{
	padding-left: 40px;
	margin:8px 0;
}