@font-face {
  font-family: 'Chalet';
  src: local('Chalet ParisNineteenSixty'),
  	url('./resources/chalet-parissixty.otf') format('opentype');
}
@font-face {
  font-family: 'Helvetica-Light';
  src: local('Helvetica Light'),
  	url('./resources/Helvetica-Light.otf') format('opentype');
}


.adjust {
	#transform: scale(.88,1);
	transform: scale(.88,.88);
	letter-spacing: .03em;
}


body {
	text-align:center;
	color:#333;
	background:#FCFCFC;

	#font-family: Chalet;
	#font-family: Garamond;
	font-family: Helvetica-Light;

	cursor:default;
}

.container {
	width: 100%;
	height: 100%;
	margin: auto;
	padding: 0;
}


/* NAVBAR */
.nav {
	position:absolute;
	bottom:0;
	left:0px;
	width:100%;

	font-size:18px;
	padding-bottom:5px;

	user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	
    background:#FEFEFE;

	z-index:9004;
}
#name {
	font-size: 28px;
}
.tagline {
	font-variant:small-caps;
}
.title {
	font-family: Chalet;
}
.trigger:hover { 
	color: #A2A2A2;
	cursor:pointer;
}
.trigger_isSelected {
	color: #A2A2A2;
}
#navwhite {
	position:absolute;
	top:0px;
	left:0px;
	height:50%;
	width:100%;
    
    background:#FEFEFE;

	z-index:9002;
}
#navwhite2 {
	position:absolute;
	top:50%;
	left:0;
	height:50%;
	width:100%;
    
    background:#FEFEFE;
    
	z-index:9001;
}
.shadowBottom {
	-moz-box-shadow:     0px 3px 3px 1px #444;
	-webkit-box-shadow:  0px 3px 3px 1px #444;
	box-shadow:          0px 3px 3px 1px #444;
}
.shadowTop {
	-moz-box-shadow:		 0px -3px 3px 1px #444;
	-webkit-box-shadow:  0px -3px 3px 1px #444;
	box-shadow:          0px -3px 3px 1px #444;
}


/* CONTENT */
.content {
	display:none;
    background:#FCFCFC;
	padding: 15px 0px 15px 0px;
	
	position:absolute;
	top:50px;
	left:0px;
	bottom:2%;
	width:100%;
	
	overflow:auto;

	z-index:1;
}

/* CONTENT */
.textcontent{
	max-width:800px;
	margin:auto;
	
	line-height: 1.15;
}

.cpyrght {
	font-size:8pt;
}


/* THUMBNAILS */
#projects {
	overflow-y:scroll;
	overflow-x:hidden;
}

.thumbs {
	position:relative;
	#width:98%;
	width:100px;
	height:100%;
	margin: 0 auto;
	#min-height:200px;
}
.thumb {
	position:relative;
	width:250px;
	height:220px;

	display:inline-block;
	
	vertical-align: middle;

	text-align:center;

	margin: 10px;
	padding: 5px;
	
	overflow: hidden;

	background:#FDFDFD;

	#box-shadow:          0px 1px 2px 1px #666 ;
	#-moz-box-shadow:     0px 1px 2px 1px #666 ;
	#-webkit-box-shadow:  0px 1px 2px 1px #666 ;

	#border-radius:				2px;
	#-moz-border-radius:		2px;
	#-webkit-border-radius:2px;
}
.thumb_innercontainer {
	width:100%;
	overflow:hidden;
}
.thumb_thumbnail {
	display:block;
	
	position:relative;
	width:100%;
	#height: auto;
	height: 80%;
	margin: auto;
	
	opacity:0.9;
	
	#border: 1px solid #333;
}
.thumb_thumbnail img {
	#width:99%;
	#height: auto;
	height:140px;
	width:auto;
	max-width:99%;
	
	margin: 0 auto;
	position: absolute;
	top:0; bottom:0; left:0; right:0;
	
	#border: 1px solid #333;	
}
.thumb_image {
	display:none;
	
	position:relative;
	width:100%;
	height:57vw;
	margin: auto;
	
	opacity:0.9;

	#border: 1px solid #333;
}
.thumb_title, .thumb_date {
	padding:0px;
	margin:8px 0px; /*top 8 rl 0*/
}
.thumb_desc, .thumb_exit, .thumb_arrow, .thumb_url {
	display:none;
}

.featured {
	position: absolute;
	top: 0;
	left: 0;
	width: 100px;
	height: 18px;
	background: #FFC300;
	transform: translateX(-30px) translateY(8px) rotate(-45deg);
}


/* SELECTED THUMBNAILS */
.thumb_isSelected {
	overflow-y:scroll;
	overflow-x:hidden;
	margin:0px;
}
.thumb_isSelected .thumb_title, .thumb_isSelected, .thumb_date {
	#padding:0px;
	#margin:5px;
}
.thumb_isSelected .thumb_thumbnail {
	display:none;
}
.thumb_isSelected .thumb_image {
	display:inline-block;

	position:relative;
	top:0;
	bottom:100%;
	
	width:100%;
	height:57vw;
	max-height:80%;
	
	margin: 0 auto;

	
	opacity:1;
}
.thumb_isSelected .thumb_image_img{
	height:100%;
	#width:auto;
    object-fit: contain;
}
.thumb_isSelected .thumb_video_frame{
	height:100%;
	#width:auto;
    #object-fit: contain;
}
.thumb_isSelected .thumb_url{
	#margin-top:10px;
	
	#display:block;
	position:relative;
	top:10px;
}
.thumb_isSelected .thumb_desc{
	display:block;
	position:relative;
	top:20px;

	margin: 0 auto 20px;
	width:90%;
	
	text-align:left;
	line-height:125%;
}
.thumb_isSelected .thumb_exit {
	display:inline;
	position:absolute;
	left:20px;
	top:0px;
	z-index:10000;
	
	cursor:pointer;
	user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.thumb_isSelected .thumb_arrow {
	#display:inline;
	font-size:10px;
	position:absolute;
	right:5%;
	bottom:-1%;
	z-index:10000;
	
	user-select: none;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}