@charset "utf-8";
body {
	background-color: #ccccff;
}
.divBody {
	background:url(../Images/header.png) repeat-x top;
}
.divHead{
	height:190px;
}
.divHead a.logo{
	background:url(../Images/logo.png) no-repeat;
	width:405px;
	height:76px;
	display:block;
	position:absolute;
	left:0;
}
.menu{
	width:350px;
	margin:0 auto 0 405px;
}
.menu a{
	float:left;
	width:82px;
	height:110px;
	display:block;
	margin-right:5px;
}
.menu a span{
	transition: all 200ms ease-out;
	width:82px;
	height:110px;
	display:block;
}
.menu a span:hover{
	height:130px;
}
.menu a span.profile{
	background:url(../Images/profile_btn.png) no-repeat bottom;
}
.menu a span.skill{
	background:url(../Images/skill_btn.png) no-repeat bottom;
}
.menu a span.portfolio{
	background:url(../Images/portfolio_btn.png) no-repeat bottom;
}
.menu a span.contact{
	background:url(../Images/contact_btn.png) no-repeat bottom;
}
.divContent{
	font-family:"微軟正黑體";
}
/*profile_content*/
.profile_content{
	margin:0 auto;
	height:100%;
	width:830px;
	margin-bottom:20px;
}
.profile_content a{
	color:#CC3366;
}
.profile_content img{
	border:10px solid #fff;
	box-shadow: 10px 10px 5px #888888;
	-moz-transform:skewY(2deg);
	-webkit-transform:skewY(2deg);
	-o-transform:skewY(2deg);
	-ms-transform:skewY(2deg);
	transform:skewY(2deg);
	border-radius:10px;
	float:left;
}
.profile_content table{
	margin-top:20px;
}
.profile_content th{
	height:24px;
	width:80px;
	font-weight:bold;
	text-align:right;
}

.profile_content td{
	height:24px;
	padding:10px;
	line-height:150%;
}
.profile_content td span{
	font-size:13px;
}
/*skill_content*/
.skill_content{
	margin:0 auto;
	width:830px;
	margin-bottom:20px;
}
.skill_content ul.percent{
	float:left;
	text-align:right;
	font-family:Arial, Helvetica, sans-serif;
	color:#006;
}
.skill_content ul.percent li{
	height:40px;
	width:70px;
}
.skill_content ul.percent li.percent50{
	height:100px;
}
.skill_content ul.line{
	float:left;
}
.skill_content ul.line li{
	border-top:1px solid #006;
	border-right:2px solid #006;
	height:40px;
	width:10px;	
}
.skill_content ul.line li.percent_top{
	height:5px;
	border:none;
}
.skill_content ul.line li.percent50{
	height:100px;
}
.skill_content ul.skill_percent{
	float:left;
}
.skill_content ul.skill_percent li{
	float:left;
	width:50px;
	height:10px;
	background:#FFF;
	margin:0 30px;
	margin-top:301px;
}
.skill_content ul.skill_percent li.skill_html{
	background:#666;
}
.skill_content ul.skill_percent li.skill_ps{
	background:#03C;
}
.skill_content ul.skill_percent li.skill_dw{
	background:#390;
}
.skill_content ul.skill_percent li.skill_ai{
	background:#F60;
}
.skill_content ul.skill_percent li.skill_fl{
	background:#F00;
}
.skill_content div:hover ul.skill_percent li{
	transition: all 400ms ease-out;
}
.skill_content div:hover ul.skill_percent li.skill_html{
	height:266px;
	margin-top:45px;
}
.skill_content div:hover ul.skill_percent li.skill_ps{
	height:226px;
	margin-top:85px;
}
.skill_content div:hover ul.skill_percent li.skill_dw{
	height:226px;
	margin-top:85px;
}
.skill_content div:hover ul.skill_percent li.skill_ai{
	height:186px;
	margin-top:125px;
}
.skill_content div:hover ul.skill_percent li.skill_fl{
	height:146px;
	margin-top:165px;
}
.skill_content ul.skill_name{
	border-top:2px solid #006;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#006;
}
.skill_content ul.skill_name li{
	float:left;
	width:110px;
	text-align:center;
	line-height:150%;
}
.skill_content ul.skill_name li.name_skill{
	width:80px;
	text-align:center;
}
/*other*/
.divTabs{
	float:left;
	margin-left:40px;
	width:55%;
}
.back_top{
	width:60px;
	height:60px;
	position:relative;
	right:-93%;
	bottom:0px;
}
.divFooter{
	background:url(../Images/footer.png) repeat-x bottom;
	padding-top:40px;
	width:100%;
	height:36px;
	color:#000033;
	font-size:13px;
	text-align:center;
	margin-top:20px;
	font-family:Arial, Helvetica, sans-serif;
	position:relative;
	bottom:0;
}
.clear{
	clear:both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}
.tdftad{
	display:none;
}