@charset "UTF-8";
/* CSS Document */
#thumbView, #thumbView1, #welcomeWrapper{
	display: -webkit-flex;
	display: flex;
	-webkit-justify-content: space-between;
    justify-content: space-between;
}


.tcover, .tcover a{
	display: -webkit-flex;
	display: flex;
	-webkit-align-content: center;
    align-content: center;
}

#welcomeContainer
{
	display: inline-block;
	min-height: 285px;
	width: 100%;
	background-color:#f5f5f5;
}

#welcomeWrapper
{
	display:flex;
	max-width: 750px;
	margin: 30px auto;
}
#profile
{
	background-image:url('Assets/profile_c.png');
	background-repeat:no-repeat;
	background-size:contain;
	width: 225px;
	height: 225px;
	margin: 0px auto;
	z-index:21;
	opacity:0;
	transition:.5s;
	
}
#profileMe
{
	width: 225px;
	transition:.3s;
	-ms-transform-origin: 50% 50%;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	z-index:25;

}
#profileMe:hover{
	-webkit-transform: scale(1.10,1.10);
	transform: scale(1.10,1.10);
	
}

#welcomeWrapper p{
	animation-timing-function:ease-in-out;
	opacity:0;
	-webkit-animation-fill-mode: forwards; /* Chrome, Safari, Opera */
 	animation-fill-mode: forwards;
	animation-duration: 2s;
}

@keyframes welFade {
    0%   {opacity: 0;}
    100% {opacity: 100;}
}

.wtext, #whead{
	display:inline-block;
	text-align:center; 
	width:100%; 
	position:relative; 
	animation-name:welFade;
}

#whead
{
	font-family: "museo-sans", sans-serif;
	letter-spacing:-.005em; 
	color:#99cc33; 
 	font-weight:600; 
 	line-height:36pt;
 	animation-name:welFade;
}

#wbody{
	font-size:14px;
	opacity: 100;
	font-weight:100;
	line-height:19.6px;
	letter-spacing:.6px;
	}

.projects{
	display:flex;
	height: 35px;
	width: 100%;
	z-index: 90;
	background-color: #fff;
	transition:opacity .5s;
}

.projects.absolute{position:fixed;top:50px;}

.projects p{
	font-family: "museo-sans", sans-serif;
	text-align: center;
	font-weight: 500;
	color: #000;
	font-size: 16px;
	line-height:16px;
	margin: 9.5px auto 0px;
	letter-spacing: .04em
}

#thumbView, #thumbView1{
	max-width:1600px;
	opacity:0;
	height:auto;
	width: 100%;
	overflow:hidden;
	transition:.3s;
}

@media only screen {.thumb {width: 100%;}#whead{font-size:36pt;margin-top:25px;}#wbody{margin:10px 0px;}#break{display:inline-block;}
	#b1, #b2, #b3{display:none;height:0;}}

@media only screen and (min-width: 550px) {.thumb {width: 50%;}#whead{font-size:48pt;margin-top:35px;}#wbody{margin:20px 0px;}#break{display:none;}
}

@media only screen and (min-width: 900px) {.thumb {width: 33.333%;} 
}

@media only screen and (min-width: 1300px) {.thumb {width: 25%;} #b1,#b2{display:block;height:auto;}}

.thumb, .tcover{
	opacity:0;
	transition: opacity .3s;
}

.thumb{
	border-style:solid;
	border: 28px;
	border-color:fff;
	position:relative;
	transform-origin: 50% 50%;
}

.tcover{
	width:100%;
	height:100%;
	background-color:#000;
	position:absolute;
	top:0px;
	z-index:6;	
	}
	
.tcover:hover { opacity:.85;}

.thumb img, .thumb p{display:inline-block;}

.thumb img{
	width:100%;
	margin-bottom:-4.5px;
	z-index:5;
}

.thumb p{
	width:100%;
	color:#fff; 
	position:relative;
	text-align:center;
	font-size:12px;
}

.ttitle{
	font-family: "museo-sans", sans-serif;
	line-height:16.2pt;
	letter-spacing:.05pc;
	font-weight:700;
}

.thumb hr{
	width:220px;
	height:1px;
	background-color:#fff;
	margin:6px auto;
}

.tDesc{
	line-height:12.2pt;
	letter-spacing:.01pc;
}

.tCat{
	font-size:8.5pt;
	line-height:18.2pt;
	letter-spacing:.008pc;
	font-style:italic;
}
