body {background-color:#FFF; margin:0px; padding:0px; text-align:center; font-family:sans-serif; font-size:13px; color:#000}

a:link {color:#039; text-decoration:underline}
a:visited {color:#006; text-decoration:underline}
a:hover {color:#36C; text-decoration:underline}
a:active {color:#C63; text-decoration:underline}

ul.langmenu {position:relative; top:0px; background-color:#58E; width:760px; padding:2px 10px 2px 10px; font-size:12px; text-transform:uppercase; list-style:none; margin:0px; border-top:4px solid #039; text-align:center; clear:both}
html>body ul.langmenu {width:740px}
ul.langmenu li {display:inline; margin:0px; padding:2px 8px; color:#FFF}
ul.langmenu li:hover {color:#FC9; background-color:#69F}
ul.langmenu li a:link, ul.langmenu li a:visited, ul.langmenu li a:active {color:#FFF; text-decoration:none}
ul.langmenu li a:hover {color:#FC9; text-decoration:none}
ul.langmenu li:hover a {color:#FC9}

body.home ul.langmenu {border-top:0px; border-bottom:4px solid #36C; text-align:right}

ul.navmenu {position:relative; top:0px; background-color:#EEE; width:760px; padding:2px 10px 2px 10px; font-size:12px; text-align:left; text-transform:uppercase; list-style:none; margin:0px; border-bottom:4px solid #36C}
html>body ul.navmenu {width:740px}
ul.navmenu li {display:inline; margin:0px; padding:2px 8px; color:#039}
ul.navmenu li.home {text-transform:lowercase; font-weight:bold}
ul.navmenu li:hover {color:#36C; background-color:#FFF}
ul.navmenu a:link, ul.navmenu a:visited, ul.navmenu a:active {color:#039; text-decoration:none}
ul.navmenu a:hover {color:#36C; text-decoration:none}
ul.navmenu li:hover a {color:#36C}

div.contents {position:relative; top:0px; margin:0px auto; padding:0px; width:760px; background-image:url(/grafx/v5/bg.png)}
html>body div.contents {width:760px}
body.links div.contents {background-image:none; background-color:#F8F8F8}

div.left {float:left; padding:0px 20px 10px 20px; width:540px; font-size:13px; text-align:justify; background-color:#F8F8F8}
div.right {float:right; padding:0px 10px 20px 10px; width:220px; font-size:12px; text-align:left; background-color:#BDF}

html>body div.left {width:500px}
html>body div.right {width:200px}

div.col3 {float:left; padding:0px 0px 10px 20px; width:240px; font-size:13px; text-align:left; background-color:#F8F8F8}
html>body div.col3 {width:220px}

body.demotape div.left {width:760px}
html>body.demotape div.left {width:720px}

img {border:0px; vertical-align:middle}

h1 {position:relative; top:0px; left:0px; width:760px; height:100px; margin:0px auto; text-align:center}
h1 span {display:none}

body.home h1 {background-image:url(/grafx/v5/en/chunshek.png)}
body.about h1 {background-image:url(/grafx/v5/en/about.png)}
body.resume h1 {background-image:url(/grafx/v5/en/resume.png)}
body.demotape h1 {background-image:url(/grafx/v5/en/demotape.png)}
body.links h1 {background-image:url(/grafx/v5/en/links.png)}
body.contact h1 {background-image:url(/grafx/v5/en/contact.png)}

body.home h1.zh-Hant {background-image:url(/grafx/v5/zh-Hant/chunshek.png)}
body.about h1.zh-Hant {background-image:url(/grafx/v5/zh-Hant/about.png)}
body.resume h1.zh-Hant {background-image:url(/grafx/v5/zh-Hant/resume.png)}
body.demotape h1.zh-Hant {background-image:url(/grafx/v5/zh-Hant/demotape.png)}
body.links h1.zh-Hant {background-image:url(/grafx/v5/zh-Hant/links.png)}
body.contact h1.zh-Hant {background-image:url(/grafx/v5/zh-Hant/contact.png)}

body.home h1.zh-Hans {background-image:url(/grafx/v5/zh-Hans/chunshek.png)}
body.about h1.zh-Hans {background-image:url(/grafx/v5/zh-Hans/about.png)}
body.resume h1.zh-Hans {background-image:url(/grafx/v5/zh-Hans/resume.png)}
body.demotape h1.zh-Hans {background-image:url(/grafx/v5/zh-Hans/demotape.png)}
body.links h1.zh-Hans {background-image:url(/grafx/v5/zh-Hans/links.png)}
body.contact h1.zh-Hans {background-image:url(/grafx/v5/zh-Hans/contact.png)}

h2 {font-size:24px; margin:10px 0px 10px; padding:0px; font-weight:normal; color:#36C; text-align:left; line-height:110%}
h3 {font-size:18px; margin:20px 0px 10px; padding:0px; font-weight:normal; color:#36C; text-align:left; line-height:110%}
h4 {font-size:13px; margin:10px 0px; padding:0px; font-weight:bold; color:#36C; text-align:left; line-height:110%}
h5 {font-size:12px; margin:10px 0px; padding:0px; font-weight:normal; color:#36C; text-align:left; line-height:110%}

p {padding:0px; line-height:150%; margin:10px 0px}

acronym {text-transform:uppercase; font-size:85%; cursor:help}
[title] {border-bottom:1px dotted; cursor:help}

.byline {font-size:12px; color:#346; margin:10px 0px 40px}
.byline a[title] {border-bottom:0px; cursor:pointer}

.footer {position:relative; top:0px; width:760px; margin-top:0px; padding:10px 10px; background-color:#36C; color:#FFF; border-top:4px solid #039; border-bottom:10px solid #039; font-size:12px; text-align:left; clear:both}
.footer a:link, .footer a:visited, .footer a:hover, .footer a:active {color:#FC6}
html>body .footer {width:740px}

div.left ul {list-style:url(/grafx/v45/bullet.png) square; margin:10px 0px; padding:0px 20px 0px 40px}
div.left li {margin:0px 0px; line-height:150%}

div.right p {line-height:120%; text-align:left}
div.right ul {list-style:url(/grafx/v45/bullet.png) square; margin:10px 0px; padding-left:24px; text-align:left}
div.right li {margin:5px 0px}
div.right a:link {text-decoration:none}
div.right a:visited {text-decoration:none}
div.right a[title] {border-bottom:0px; cursor:pointer}

div.right ul li dl {margin:0px; padding:0px}
div.right ul li dl dt {font-weight:bold; margin-top:0px}
div.right ul li dl dd {margin:0px}

div.left dl {margin:10px 0px}
div.left dl dt {font-weight:bold; color:#36C; margin-top:10px}
div.left dl dd {padding:0px; margin:0px 20px; font-size:12px}
div.left input, div.left textarea, div.left select {font-family:sans-serif; font-size:12px; padding:1px}
div.left input[type="text"], div.left input[type="password"], div.left textarea, div.left select {background-color:#FFF; border:1px solid #DDD}

div.col3 dl {margin:10px 0px}
div.col3 dl dt {font-weight:bold; color:#36C; margin-top:10px}
div.col3 dl dd {padding:0px; margin:0px 20px; font-size:12px}

blockquote {margin:10px 20px; line-height:150%}

div.right dl {margin:10px 0px}
div.right dl dt {font-weight:bold; color:#36C; margin-top:10px}
div.right dl dd {padding:0px; margin:0px 20px}

div.right dl.extended {position:relative}
div.right dl.extended dt {margin:10px 0px 0px 0px; clear:both; font-size:15px}
div.right dl.extended dt img {width:48px; height:48px; padding:2px; border:1px solid #36C; margin:0px 10px 10px 0px; background-color:#FFF; float:left}
div.right dl.extended dd {margin:0px 0px 0px 54px}

div.left dl.portfolio {position:relative}
div.left dl.portfolio dt {margin:10px 0px 0px 0px; clear:both}
div.left dl.portfolio dt img {width:160px; height:120px; padding:4px; border:1px solid #999; margin:0px 10px 10px 0px; background-color:#FFF; float:left}
div.left dl.portfolio dd {margin:0px 0px 0px 180px}

div.left hr {background-image:url(/grafx/v45/hr1.png); height:10px; border:none; margin:20px -20px; width:540px}
div.right hr {background-image:url(/grafx/v45/hr2.png); height:10px; border:none; margin:20px -20px; width:220px}

/* QUICKTIME SPECIFIC STYLESHEETS */

/* hides the second object from all versions of IE */
* html object.mov {
    display: none;
}

/* displays the second object in all versions of IE apart from 5 on PC */
* html object.mov/**/ {
    display: inline;
}

/* hides the second object from all versions of IE >= 5.5 */
* html object.mov {
    display/**/: none;
}