.page-wrapper {
	overflow: hidden;
	position: absolute;
	/*
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	*/
	/* width: 3300px; */
	/* height: 600px; */ /* determined by javascript */
}

.content-pane-wrapper {
	position: relative;
	display: block;
	width:100%;
	z-index: 999;
}

.content-pane {
	position: relative;
	display: block;
	/* overflow-x: scroll; */
	overflow-x: auto;
	overflow-y: hidden;
	-webkit-overflow-scrolling: touch;
	margin: 0 auto;
	/*
	padding: 0 auto 0 auto;
	*/
	width:100%;
	height: 600px;
	text-align: center;
	-webkit-transition: margin-top 0.3s ease;
	-moz-transition: margin-top 0.3s ease;
	-o-transition: margin-top 0.3s ease;
	transition: margin-top 0.3s ease;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	z-index: 1000;
}
.content-pane::-webkit-scrollbar {
	height: 8px;
}
.content-pane::-webkit-scrollbar-track {
	background-color: rgba(255, 255, 255, 0);
	height: 8px;
	-webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0.0);
	-webkit-3dlight-color: rgba(255, 255, 255, 0);
	border-top: 0px none #e0e0e0;
    border-radius: 8px;
	
	background-clip: padding-box;
	border: solid transparent;
	border-width: 0 0 0 4px;
}

.content-pane::-webkit-scrollbar-thumb {
	background-color:#c0c0c0;
	height: 8px;
	border-radius:5px;
}
.content-pane::-webkit-scrollbar-corner {
	background: transparent;
}

.header-link-icon {
	margin: 3px 13px auto 0;
}

.subheader {
	position: relative;
	clear: both;
   /*  overflow: hidden; */
    overflow: visible;
	width: 100%;
	text-align: center;
	color: black;
	font-size: 100%;
	z-index: 2000;
}

.subheader-content {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 48px;
	margin: auto;
}

.subheader-L {
	position: absolute;
	display: table-cell;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto 0 auto 0;
	float: left;
	width:15%;
	height: 1.4em;
	padding-left: 13px;
	text-align: left;
	min-height:1px;
	vertical-align: middle;
}

.subheader-center {
	position: absolute;
	display: table-cell;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	float: left;
	width: 70%;
	height: 1.4em;
	text-align: center;
	min-height:1px;
	font-size: 108%;
	font-family: 'Lato', sans-serif;
	/* font-family: Gulim, sans-serif; */
	letter-spacing: 2px;
	color: black;
}

.subheader-R {
	position: absolute;
	display: table-cell;
	top: 0;
	right: 0;
	bottom: 0;
	margin: auto 0;
	float: right;
	width: 15%;
	height: 1.4em;
	padding-right: 13px;
	text-align: right;
	min-height:1px;
}

.subheader2 {
	position: relative;
	clear: both;
    overflow: hidden;
	width: 100%;
	height: 48px;
	text-align: left;
	color: rgb(108, 108, 108);
	font-family: 'Lato', sans-serif;
	font-size: 88%;
	/* border: 1px solid red; */
	z-index: 2000;
}

.subheader2L {
	position: absolute;
	display: table-cell;
	bottom: 0;
	left: 0;
	margin: auto 0 auto 0;
	float: left;
	width:50%;
	height: 1.4em;
	padding-left: 13px;
	text-align: left;
	min-height:1px;
}

.has-xbtn { }
.has-ibtn { }
.has-langsw { }


.lang-switch {
	position: relative;
	display: inline-block;
	/*
 	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	*/
	top: 0;
	bottom: 0;
	margin-top: 5px; 
	margin-bottom: auto;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 0.90em;
	/* line-height: 1.8; */
	text-decoration: none;
	letter-spacing: 1px;
}
@media screen and (max-width:400px) {
	.lang-switch {
		font-size: 0.98em;
	}
}

.lang {
	opacity: 0.5;
}

/*
a.hover {
	opacity: 0.4;
}
*/
@media screen and (min-width:768px) {
	.lang:hover {
		opacity: 0.4;
	}
}
.lang-selected {
	color: black;
	opacity: 1.0;
}

.switch-lang-separator{
	font-size: 100%;
	margin: 0 3px 0 3px;
	opacity: 0.5;
}

.slide-nav {
	position: relative;
	clear: both;
	display: block;
	margin-top: 8px;
	/* width: 80px; */
	width: 100%;
	text-align: center;
	/* bottom: 40px; */ /* ... set in javascript */
	opacity: 1.0;
}

div.footer {
	clear: both;
	position: absolute;
    overflow: hidden;
	bottom: 0;
	width: 100%;
    height: 2.1em;
	padding: 6px 13px;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 70%;
	background: #FFF;
	color: #c0c0c0;
}

div.footer-L {
	margin: auto 0 auto 0;
	display: inline-block;
	float: left;
}

div.footer-R {
	margin: auto 0 auto 0;
	display: inline-block;
	float: right;
	letter-spacing: 1px;
	opacity: 0.5;
}

/*
.pure-u-1,
.pure-u-md-1-3,
.pure-u-lg-1-3 {
	border: solid 1px red;
}
*/

.grid-panel-proj {
	box-sizing: border-box;
	padding: 0 1em 1em 1em;
	margin-bottom: 1em;
	/* text-align: left; */
}

.grid-panel-home {
	box-sizing: border-box;
	padding: 0 0 0.4em 0;
	margin: 0 0.5em 1em 0.5em;
	border: solid 1px #e0e0e0;
}

.grid-panel-simple {
	box-sizing: border-box;
	padding: 0;
	margin: 0.5em;
}

.grid-thumbnail {
	position: relative;
	margin-bottom: 0.4em;
	min-width:100%;
	height: auto;
}

.panel-textarea {
	margin: 0 0.5em 0 0.5em;
	width: 95%;
}

.panel-title {
	font-size: 85%;
	font-family: 'Lato', sans-serif;
	/*letter-spacing: 1px;*/
	margin: 0 0 0.3em 0;
	text-decoration: none;
	/* letter-spacing: 1px; */
	line-height: 1.4;
}

.panel-metadata {
	font-family: 'Lato', sans-serif;
	font-size: 84%;
	text-decoration: none;
	opacity: 0.5;
}

.news-description {
	width: 100%;
	padding: 1em;
	text-align: left;
	font-size: 92%;
	font-family: 'Libre Baskerville', serif;
}

.news-description-1word {
	width: 100%;
	padding: 1em;
	text-align: center;
	font-size: 92%;
	font-family: 'Libre Baskerville', serif;
}

.pad0 {
	padding: 0;
	margin: 0;
}

.page-arrow { display: inline-block !important; background: url(../img/arrows.svg) no-repeat !important; width: 24px !important; height: 24px !important; background-size: auto !important; }
.page-arrow.page-arrow-R { background-position: 100% -24px !important; }
@media screen and (min-width:768px) {
	.page-arrow.page-arrow-L:hover { background-position: 0 -24px !important; cursor: pointer; }
	.page-arrow.page-arrow-R:hover { background-position: 100% 0px !important; cursor: pointer; }
}
.page-arrow.page-arrow-R { margin-left: 32px; }

.projects button { position: absolute; background: url(../img/arrows.svg) no-repeat !important; width: 24px !important; height: 24px !important; background-size: auto !important; text-indent: -9999px; overflow: hidden; display: none !important; }
.projects button.slick-prev { left: inherit; right: 75px; background-position: 0 0 !important; }
.projects button.slick-next { right: 0px; background-position: 100% -24px !important; }
@media screen and (min-width:768px) {
	.projects button.slick-prev:hover { background-position: 0 -24px !important; }
	.projects button.slick-next:hover { background-position: 100% 0px !important; }
}

.DBG {
	border-style: solid;
	border-color: red;
	border-width: 1px;
}