/* Works CSS - Deign Thinking */

/* Section 1 - Design Thinking Intro */
#designThinking-intro{
	background:url(img-BG-donNorman-1920x938.jpg)fixed;
	background-size:cover;
	background-position:center center;
	position:relative;
	top:80px;
	height:850px;
}
.designThinking-intro-bgTexture{
	background:url("../img/universal/BG-texture-black-1x1.png") repeat;
	width:100%;
	height:100%;
	padding-top:40px;
}

#popOver-DT-intro{
	position: relative;
	top:450px;
	width:70%;
	float: right;
}
/*.avatar-donNorman{
	background:url("../img/designThinking/img-Avatar-donNorman.jpg") no-repeat;
}*/

/* Section 2 - Identify Problem */
.designThinking-section{
	background-size:cover;
	background-position:center center;
	position:relative;
	top:80px;
	height:850px;
}
#designThinking-problem{
	background:url("img-BG-whtieBoard-1920x938.jpg") fixed;
}
#designThinking-ideation{
	background:url("img-BG-studio-1920x938.jpg") fixed;
}
.designThinking-problem-bgTexture{
	width:100%;
	height:100%;
	padding-top:40px;
}

/* Section - 2: Gallery Settings */
.content{
	margin-top:20px;
	display:none;
	width:1024px;
}
.dt-gallery-container{
	position:relative;
	height:576px;
	width:1024px;
}
.loader{
	position:absolute;
	top:0;
	left:0;
	width:1024px;
	height:576px;
	background:url("../img/universal/icn-gallery-loader.gif") no-repeat center;
}

/* Gallery Thumbnail Settings */
.navigation{
	top:596px;
	position: relative;
	display:inline-block;
}
.thumbs{
	width:1024px;
	margin:0;
	padding:0;
}
.thumbs li{
	list-style:none;
	float: left;
	margin-right:10px;
}
.thumbs img{
	border:3px solid rgba(18, 150, 232, 0);
	background-color:none;
	display:block;
}
.thumb{
	cursor:pointer;
}
.thumbs li.selected img{
	border:3px solid rgba(18, 150, 232, 1);
}

/* Gallery Caption Settings */
.slideshow span.image-wrapper{
	display:block;
	position:absolute;
	top:0;
	left:0;
}
.slideshow a.advance-link{
	display:block;
	width:1024px;
	height:576px;
}
.caption{
	border-left:5px solid #0d9fff;
	font-weight: 200;
	font-size:0.9em;
	width:1024px;
	height:50px;
	background-color:rgba(0,0,0,0.75);
	color:#fff;
	border-top:1px solid #0d9fff;
	position:absolute;
	top:547px;
	padding:5px 10px;
}
.image-title{
	text-transform:uppercase;
	font-weight: 600;
}

/* AR Monopoly CSS */
.sketchFab-intro{
	border-top:1px solid #0d9fff;
	color:#fff;
	background-color:rgba(0,0,0,0.5);
	padding:10px 20px;
}
.sketchFab-intro-darker{
	border-top:1px solid #0d9fff;
	color:#fff;
	background-color:rgba(0,0,0,0.7);
	padding:10px 20px;
}
.sketchFab-intro h4, .sketchFab-intro-darker h4{
	color:#0d9fff;
}
.sketchFab-foodie{
	color:#fff;
	padding:10px 20px;
}
.sketchFab-demo{
	padding-left:30px;
}
.sketchFab-demo iframe{
	width:640px;
	height: 480px;
}

/* JIRO DREAMS OF SUSHI DETAILS */
.mini-3d-albumDisplay{
	width:100%;
	display:flex;
	display:-webkit-flex;
}
.mini-3D-album{
	height:135px;
	width:180px;
	margin-right:20px;
	padding:0px;
}

.mini-3D-album p{
	z-index:1;
	width:100%;
	height:45px;
	background-color:rgba(0,0,0,0.7);
	color:#fff;
	font-size:0.9em;
	padding:5px 10px;
	box-sizing:border-box;
	position:absolute;
	bottom:-45px;
	transition:bottom 0.2s, opacity 0.2s;
	-webkit-transition:bottom 0.2s, opacity 0.2s;
	opacity:0;
	border-left:5px solid #0d9fff;
}
#mini-3D-album-pic{
	border:1px solid #a7a7a7;
	display:block;
	position:absolute;
	height:135px;
	width:180px;
	box-sizing:content-box;
}
#mini-3D-album-pic-after{
	width:180px;
	height:135px;
	opacity: 0;
	content:"";
	position: absolute;
	border:1px solid #0d9fff;
	transition: opacity 0.2s;
	-webkit-transition:opacity 0.2s;
	box-sizing:content-box;
}
.mini-3D-album:hover #mini-3D-album-pic-after{
	opacity: 1;
}
.mini-3D-album:hover p{
	opacity: 1;
	bottom:-10px;
}
.mini-3D-album-height{
	height:30px;
}

/* UXUI - Data Visualization */
#dataVisualization-intro-ui{
	position:absolute;
}
#dataVisualization-intro-overlay{
	opacity: 0;
	position:absolute;
	transition:opacity 0.2s;
	-webkit-transition:opacity: 0.2s;
}
#dataVisualization-intro:hover #dataVisualization-intro-overlay{
	opacity:1;
}
.dataVisualization-intro-block{
	position:absolute;
	color:#fff;
	font-size:0.9em;
	background-color:rgba(6,35,66,0.75);
}
.dataVisualization-intro-block img{
	margin-right:5px;
}
.dataViz-intro-copy{
	padding:0 20px 20px 20px;
}
#dataViz-intro-builder{
	width:200px;
	position:absolute;
	top:350px;
	left:80px;
}
#dataViz-intro-builder-title{
	padding:10px;
	font-size:1.2em;
	color:#42cef3;
	border-left:5px solid #42cef3;
}
#dataViz-intro-builder-title:hover{
	color:#96e9ff;
	text-decoration:underline;
}
#dataViz-intro-viz{
	width:200px;
	position:absolute;
	top:350px;
	left:500px;
}
#dataViz-intro-viz-title{
	padding:10px;
	font-size:1.2em;
	color:#d9bdff;
	border-left:5px solid #d9bdff;
}
#dataViz-intro-viz-title:hover{
	color:#e8d7ff;
	text-decoration:underline;
}
#dataViz-intro-filter{
	width:150px;
	position:absolute;
	top:350px;
	left:857px;
}
#dataViz-intro-filter-title{
	padding:10px;
	font-size:1.2em;
	color:#8aeccf;
	border-left:5px solid #8aeccf;
}
#dataViz-intro-filter-title:hover{
	color:#c3feed;
	text-decoration:underline;
}
#dataViz-intro-toolbar{
	height:35px;
	position:absolute;
	top:51px;
	left:0px;
}
#dataViz-intro-toolbar-title{
	width:170px;
	height:35px;
	padding:3px 10px 0 10px;
	font-size:1.2em;
	color:#f8bf2c;
	border-left:5px solid #f8bf2c;
}
#dataViz-intro-toolbar-title:hover{
	color:#ffdd84;
	text-decoration:underline;
}
#dataViz-intro-sheetTab{
	height:38px;
	position:absolute;
	top:745px;
	left:363px;
}
#dataViz-intro-sheetTab-title{
	width:175px;
	height:38px;
	padding:5px 10px 0 10px;
	font-size:1.2em;
	color:#fea1c5;
	border-left:5px solid #fea1c5;
}
#dataViz-intro-sheetTab-title:hover{
	color:#ffd1e3;
	text-decoration:underline;
}
.color-viz-yellow{
	color:#f8bf2c;
}
.color-viz-cyan{
	color:#42cef3;
}
.color-viz-purple{
	color:#d9bdff;
}
.color-viz-teal{
	color:#4dd2c4;
}
.color-viz-pink{
	color:#fea1c5;
}
.color-data-blueGrey{
	color:#7fd2e8;
}
.divider-mini-cyan{
	border-bottom:1px dashed #42cef3;
}
.divider-mini-purple{
	border-bottom:1px dashed #a468f0;
}
.divider-mini-teal{
	border-bottom:1px dashed #4dd2c4;
}
.divider-mini-pink{
	border-bottom:1px dashed #fea1c5;
}
.divider-mini-blueGrey{
	border-bottom:1px dashed #7fd2e8;
}

/* Data Visualzation Vizboard Layover Icon Title */
.dataViz-icon-title{
	float: left;
	margin-right:5px;
}
.dataViz-icon-title-text{
	padding-top:5px;
}

.tooltip > div{
	text-align: left;
}

/* Jiro Problem Statement Iamges */
.jiro-movie-pics img:nth-of-type(2){
	position: absolute;
	top:170px;
	right:0px;
	z-index:1;
}
.jiro-movie-pics img:nth-of-type(3){
	position: absolute;
	top:330px;
	left:20px;
}
.jiro-glassHouse-pics img:nth-of-type(2){
	position: absolute;
	top:260px;
	right:0px;
	z-index:1;
}
.jiro-glassHouse-pics img:nth-of-type(3){
	position: absolute;
	top:450px;
	left:20px;
}

/* SeedDiary Research Iamges */
.seedDiary-research-pics img:nth-of-type(2){
	position: absolute;
	top:20px;
	right:40px;
	z-index:1;
}
.seedDiary-research-pics img:nth-of-type(3){
	position: absolute;
	top:250px;
	left:40px;
}
.seedDiary-research-pics img:nth-of-type(4){
	position: absolute;
	top:220px;
	right:0px;
	z-index:1;
}

.btn-download-foodie{
	width:150px;
	height: 32px;
	position: relative;
	top:140px;
}
.btn-download-report{
	width:150px;
	height: 32px;
}
#AR-data-problem-1{
	position: absolute;
	right:0px;
	top:0px;
}
#AR-data-problem-2{
	position: absolute;
	left:0px;
	top:180px;
}
#AR-data-problem-text{
	position: absolute;
	left:0px;
	top:4px;
	width:280px;
}
#AR-data-sketch4{
	position: absolute;
	top:130px;
	left:130px;
}
#AR-data-sketch5{
	position: absolute;
	top:310px;
	left:30px;
}