@CHARSET "UTF-8";
html, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, input, p { margin: 0; padding: 0; }
a { text-decoration: none; color: #666666; }
html { width: 100%; height: 100%; }
body { font-family: Calibri, Arial, sans-serif; font-size: 14px; background: #FFFFFF; color: #666666; width: 100%; line-height: 24px; overflow-y: scroll; overflow-x: hidden; }
.clear { clear:both; }
#copyright { font-size: 10px; text-align:right; line-height: 18px; float: right; padding-top: 7px; }
#top-wrap, #nav-wrap { width:100%; clear: both; position: fixed; bottom: 0px;  background-color: #FFF; padding-bottom: 50px; }
.container, .container-iam, .container-iam2 { margin: 90px auto 0px; max-width: 960px; width: 100%; }
#content-wrap { min-height: 350px; margin: 0px 10px 0px 10px; width: 100%; }
#top-container { border-bottom: 1px solid #efefef; }
#site-logo-text { font-size: 28px; color: #666666; line-height: 38px; padding-left: 10px; }
#site-logo-text:hover { color:#777; }
#landing-board { position: relative; width: 100%; overflow: hidden; }
#landing-board-img { float:left; max-width: 100%; max-height: 100%; }
#landing-board-text { position: absolute; bottom: 0; left: 20px; color: #ccc; font-size: 46px; padding: 0px 0px 0x 0px; font-style: italic; }
#nav-container { border-top: 1px solid #efefef; margin-top: 0px; min-width: 400px; }
#nav { line-height: 1; float: left; }
#nav ul { list-style: none; display: inline;  }
#nav li { list-style: none; display: inline; margin-right: 26px; float: left; }
#nav ul li a { list-style: none; display: block; text-decoration: none; font-size: 14px; color: #000000; padding: 15px 7px 4px; border: 0; box-sizing:border-box; }
#nav ul li#actived a{ padding: 15px 7px 4px; border-bottom: 1px solid #777777; color:#000000; }
#nav ul li a:hover { padding: 15px 7px 4px; border-bottom: 1px solid #777777; color: #555555; }
#profile-img { height: 250px; padding: 4px; border: 1px solid #dedede; }
#iam-intro-left, #iam-cv-left { font-size: 17px; padding-right: 105px; text-align: justify; line-height: normal; width: auto; overflow: hidden;  }
#iam-intro-left { height: 266px; }
.iam-right { float: right; width: 340px; padding: 0px 10px 10px 0px;}
.container-iam, .container-iam2 { margin-bottom: 0px; height: auto; overflow: hidden; }
.container-iam2 { margin: 0px auto; }
.sect-title-wrap { padding-bottom: 17px; }
.sect-title { margin-top: 15px; padding: 0px 4px 2px 4px; border-bottom: 1px solid #777777; color: #555555; }
#cv-grid { border-collapse: collapse; }
#cv-grid tr td { padding-bottom: 7px; }
.cv-info { float: left; width: 100%; }
.cv-date { float: left; vertical-align: middle; text-align: left; width: 20%; }
.cv-caption { float: left; vertical-align: middle; text-align: left; width: 80%; }
.cv-plain { float: left; vertical-align: middle; text-align: left; }
/* .mywork-item-row { float: left; height: auto; width: 100%;} */
.mywork-item-wrap { position: relative; float: left; width: 240px; height: 240px; padding: 0px 0px 60px 0px; margin-left: 40px; margin-right: 40px; margin-bottom: 45px; }
/* .mywork-item-wrap-right { width: 270px; } */
.mywork-photo-wrap { width: 100%; height: 100%; text-align: center;  }
.mywork-photo-tbl { width: 100%; height: 100%; text-align: center; }
.mywork-img { padding: 4px; border: 1px solid #dedede; width: 240px; height: 240px;}
.mywork-item-text { position: absolute; bottom: 0px; width: 100%; text-align: center; padding: 0px 4px; }
.myworkdetail-inline-img-div { display: -webkit-flex; -webkit-justify-content: space-between; display: flex; justify-content: space-between; }
.myworkdetail-img { padding: 4px; border: 1px solid #dedede; max-width: 100%; }
.myworkdetail-caption, .newdetail-caption, .newdetail-caption-end { margin: 3px 0px 30px 0px; text-align: justify; }
.news-showgrp-item { margin-bottom: 40px; }
.news-showgrp-img-wrap { float: left; width: 350px; text-align: left; }
.news-showgrp-img { max-width: 100%; }
.news-showgrp-info { float: left; width: 610px; }
.news-showgrp-date { float: left; vertical-align: middle; text-align: left; width: 20%; }
.news-showgrp-caption { float: left; vertical-align: middle; text-align: left; width: 80%; }
.newsdetail-div-img { display: inline-block; }
.newsdetail-div-img:hover { background-image:url("../images/zoom.png"); background-repeat: no-repeat; background-position: center; }
.newsdetail-img { z-index: -1; position: relative; top: 0; left: 0; padding: 4px; border: 1px solid #dedede; max-width: 100%; }
.newdetail-caption-end { margin-bottom: 10px; }