html, body, div, span, applet, object, iframe,
h1, h2, h31, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center, ol, ul, li {
    margin-left: 0.1em;
    padding: 0;
    border: 0;
    margin: 0;
    font-size: 100%;
    vertical-align: baseline;
    font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
    <!-- font-family: "Segoe UI", Calibri, Tahoma, Arial, sans-serif;
    / -->
    font-size: normal;
}

/* body {
    height:100%;
	overflow:hidden;
	margin:0px;
	padding:0px;
} */

b {
   color: #ff5600;
}

p {
    text-align: justify;
    margin-top: 0em;
    margin-bottom: 0.8em;
    margin-right: 0.9em;
    margin-left: 1em;
}

    p#header {
        margin: 0;
        padding-bottom:7px;
        padding-top:10px
    }

h1, h2, h31, h3, h4, h5, h6 {
    margin: 0.3em;
    font-family: Helvetica, “Helvetica Neue”, Arial, sans-serif;
    font-weight: bold;
    /*color: #FF6600;
        */
}

h1 {
    font-size: 1.8em;
    margin-top: 1em;
}


h2 {
    font-size: 1.6em;
    margin-top: 1em;
    color: #ff5600;
}

h31 {
    font-size: 120%;
    margin-top: 0.8em;
}

h3 {
    font-size: 120%;
    text-decoration: underline;
    margin-top: 0.8em;
}

h4 {
    margin-left: 0.7em;
    margin-top: 0.8em;
}

a:link {
    color: #FF6600;
}

a:visited {
    color: #FF6600;
}


a:hover {
    color: #ff9d4b;
}

a:active {
    color: #ff5600;
}


a[href $="mov"]:after, a[href $="avi"]:after, a[href $="mp4"]:after, a[href $="wmv"]:after {
    padding-left: 4px;
    /*content: url(../images/icons/vid-icon-grey-16x16.png);*/
}


a[target =_blank]:after{
    padding-left: 4px;
    content: url(../images/icons/icon-external-11x11.png);
}

a[href ^="mailto:"]:after {
    padding-left: 4px;
    content: url(../images/mailto.jpeg);
}

a[href $="pdf"]:after {
    padding-left: 4px;
    /*content: url(../images/icons/pdf-icon-white-16x16.png);*/
}


a[href $="bib"]:after {
    padding-left: 4px;
    content: url(../images/icons/bib-icon-16x16.png);
}


a[href *="slides"], a[href $="slides.pdf"]:after {
    padding-left: 4px;
    content: "Video" url(../images/icons/ppt-icon-16x16.png);
}




/*Background*/
div#header-bg {
    margin: 0;
    height: 45px;
    position: absolute;
    top: 270px;
    width: 100%;
    background-color: #FF6600;
    z-index: -1;
}

div#personal-info {
    position: relative;
    height: 230px;
    margin-left: 0.6em;
}

span#name {
    font-family: "Arial Black", "Arial Bold", Gadget, sans-serif;
    font-size: 1.9em;
    font-weight: bold;
}

span#title {
    font-size: large;
    font-weight: normal;
    color: gray;
}

div#portrait {
    float: left;
    width: 150px;
    margin-left: 0.2em;
}

div#header-text {
    font-size: 1em;
    margin-left: 200px;
    min-width: 16em;
}

div#welcome-pic {
    float: left;
    width: 400px;
    height: 300px;
    margin-left: 0.2em;
}

div#welcome-text {
    font-size: 1em;
    margin-left: 400px;
    height: 300px;
    min-width: 16em;
}

div#news-dynamictext {
    font-size: 1em;
    height: 250px;
    min-width: 16em;
}



/*Main Column*/
div#column {
    width: 52em;
    position: relative; /* needed for footer positioning*/
    /*height: auto !important;  real browsers */
    height: 100%; /* IE6: treaded as min-height*/
    min-height: 100%; /* real browsers */
    margin: 2em auto; /* the bottom margin is the negative value of the footer's height */
    margin-top:0em;
    border-color: #AAA;
    border-style: solid;
    border-left-width: 1px;
    border-right-width: 1px;
	-webkit-background-size: cover;
}

div#version {
    height: 100px;
	position: absolute;
	bottom: 50px;
	margin: auto;
	z-index: 0;
	overflow: hidden;
}


/*Navigation*/
div#page-menu {
    /*background-color: #0663c1;*/
    text-align: center;
    margin-left: 0.1em;
    margin-right: 0.1em;
    margin-top: 1.3em;
    font-size: 1em;
    font-weight: bolder;
    text-transform: uppercase;
    background-color: #ff6600;
    padding-top: 0.75em;
    padding-bottom: 0.75em;
}



ul#navi-list li {
    margin: 0;
    list-style: none;
    display: inline;
    padding: 0em;
    padding-left: 0.3em;
    padding-right: 0.3em;
    text-wrap:normal;
}

    ul#navi-list li + li {
        border-left: 1px solid #D1D1E0;
    }

* html ul#Navigation a, * html ul#Navigation span { /* Korrektur fuer IE 5.x */
    width: 8em;
    w\idth: 6em;
}

ul#navi-list a:link {
    color: white;
    text-decoration: none;
}

ul#navi-list a:visited {
    color: white;
    text-decoration: none;
}

ul#navi-list a:hover {
    color: #ff9d4b;
    border-bottom: 1px solid #ff9d4b;
}

ul#navi-list a:active {
    color: #ff9d4b;
    border-bottom: 1px solid #ff9d4b;
}


dl.definitionlist {
    margin-left: 0.2em;
    margin-top: 0.2em;
}

    dl.definitionlist dt {
        float: left;
        font-weight: bold;
    }

    dl.definitionlist dd {
        float: none;
        padding-bottom: 0em;
        margin-left: 80px;
        text-align: justify;
    }


dl#jobslist {
    margin-right: 0.9em;
    margin-left: 1em;
}


.clearThis {
    clear: left;
    float: none;
    height: 0;
    line-height: 0.0em;
    background-color: #FFF;
    width: 100%;
}


.autoStyleGray {
    font-size: medium;
    font-weight: bold;
    color: gray;
}

.autoStyleBl {
    font-size: medium;
    font-weight: bold;
    color: black;
}

.autoStyleNonBold {
    font-size: medium;
    font-weight: normal;
}

/*-------------
* PUBLICATIONS
*/

div.compositeModule_3_1 {
    text-align: justify;
    min-height: 50px;
    margin-left: 1em;
    margin-right: 1em;
    margin-top: 0.1em;
    margin-bottom: 0.3em;
    border-bottom: dashed 1px silver;
}

div.zoneLeft {
    float: left;
    width: 75%;
}

div.zoneRight {
    float: right;
    width: 22%;
}

div.clearLeft {
    clear: left;
}

div.clearBoth {
    clear: both;
    margin-bottom: 0.5em;
}

div.compositeModule_3_1_Wide {
    text-align: justify;
    min-height: 50px;
    margin-left: 1em;
    margin-right: 1em;
    margin-top: 0.1em;
    margin-bottom: 0.3em;
    border-bottom: dashed 1px silver;
}

div.zoneLeftMed {
    float: left;
    width: 80%;
}

div.zoneRightMed {
    float: right;
    width: 19%;
}

div.zoneLeftWide {
    float: left;
    width: 90%;
}

div.zone {
    width: 100%;
}


.pubTitle {
    font-size: medium;
    font-weight: bold;
    color: #ff5600;
}

.pubBlackTitle {
    font-size: medium;
    font-weight: bold;
    color: #000000;
}

.pubYear {
    font-size: 200%;
    color: #ff5600;
}

.pubText {
    color: #ff5600;
}

.pubUnderlineText {
    color: #ff5600;
    text-decoration: underline;
}

.pubAuthors {
    font-size: medium;
    font-weight: normal;
    color: black;
}

.pubProc {
    font-size: medium;
    font-weight: normal;
    font-style: italic;
    color: black;
}

.pubContainer {
    text-align: justify;
}

.imgFloatRight {
    width: 180px;
}

.imgPrev {
    margin-left: 10px;
    width: 140px;
}

.imgPrevVert {
    margin-left: 10px;
    width: 140px;
    height: 80px;
}

/*-------------
* END PUBLICATIONS
*/

ul#community {
    font-size: 0.91em;
    text-align: left;
    margin-left: 2.2em;
    padding: 0;
}

/*----
* backToTop button 
*/
div#toTop {
    border: 2px solid #ff9d4b;
    background: #ff5600;
    text-align: center;
    padding: 0.4em 0.7em 0.4em 0.7em;
    position: absolute; /* this is the magic */
    bottom: 10px;
    right: 10px;
    cursor: pointer;
    display: inline;
    color: white;
    font-family: Calibri, Candara, Segoe, "Segoe UI", Optima, Arial, sans-serif;
    font-size: 75%;
    font-weight: bold;
    text-transform: uppercase;
}

html > body div#toTop { /* nur fuer moderne Browser! */
    position: fixed;
}


    div#toTop a:link {
        color: white;
        text-decoration: none;
    }

    div#toTop a:visited {
        color: white;
        text-decoration: none;
    }

    div#toTop a:hover {
    color: #ff9d4b;
    border-bottom: 1px solid #ff9d4b;
    }

    div#toTop a:active {
     color: #ff9d4b;
    border-bottom: 1px solid #ff9d4b;
    }

    div#toTop:after, div#toTop:before {
        bottom: 100%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
    }

    div#toTop:after {
        border-color: rgba(78, 114, 184, 0);
        border-bottom-color: #ff5600;
        border-width: 5px;
        left: 50%;
        margin-left: -5px;
    }

    div#toTop:before {
        border-color: rgba(149, 170, 212, 0);
        border-bottom-color: #ff9d4b;
        border-width: 8px;
        left: 50%;
        margin-left: -8px;
    }


/**Video Box on main page**/
div#videos {
    text-align:left;
}


/*----Footer---*/
div#Footer {
    position: absolute;
    width: 100%;
    bottom: 0; /* stick to bottom */
    background: #ddd;
    height: 45px;
    clear: both;
    margin: 0;
    padding: 0.1em;
    text-align: center;
}


/******Project pages*******/
/*Main Column*/
div#column_projects {
    width: 51em;
    position: relative; /* needed for footer positioning*/
    height: auto !important; /* real browsers */
    height: 100%; /* IE6: treaded as min-height*/
    min-height: 100%; /* real browsers */
    margin: 0.8em auto; /* the bottom margin is the negative value of the footer's height */
    margin-top: 0;
    border-style: none;
    border-left-width: 0px;
    border-right-width: 0px;
}


/*multiple videos on main page*/
div#videos_box {
    width: 100%;
    margin-left: 1em;
}

div#video {
    text-align: center;
    margin-left: 1em;
}

    /*IFrames for embedded video on project pages*/
iframe.video_large {
    width: 500px; height: 281px; frameborder: 0; webkitAllowFullScreen: true; mozallowfullscreen: true; allowFullScreen: true;
}

ul.link_list {
    width: 500px;
    list-style-type: none;
    margin-left:1.2em;
    line-height:18px;
}

    ul.link_list li {
        border-bottom: dashed 1px silver;
        padding-bottom:0.2em;
        padding-top:0.2em;
    }


    /**Style for ACM Links and Stats*/
div.acm_dl {
    margin-top: 0.3em;
    margin-bottom: 0.8em;
    margin-right: 0.9em;
    margin-left: 1em;
}

/* pictures transformview*/
  #album{
    position:absolute;
    width:400px;
    height:300px;
    overflow:hidden;/*隐藏tip*/
  }
  #album dt {
    margin:0;/*去除浏览器的默认设置*/
    padding:0;/*去除浏览器的默认设置*/
    width:400px;
    height:300px;
    overflow:hidden;/*重点，让每次只显示一张图片*/
  }
  #album img {
    height:100%;
    border:0px;
  }
  #album dd {/*翻页栏*/
    position:absolute;
    right:0px;
    bottom:10px;
  }
  #album a {
    display:block;/*让其拥有盒子模型*/
    float:left;
    margin-right:5px;/*错开格子*/
    width:15px;/*呈正方形*/
    height:15px;
    line-height:15px;
    text-align:center;/*居中显示*/
    text-decoration:none;/*消除下划线*/
    color:#808080;
    background:transparent url(http://images.cnblogs.com/cnblogs_com/rubylouvre/199042/o_button.gif) no-repeat -15px 0;
  }
  #album a:hover ,#album a.hover{
    color:#F8F8F8;
    background-position:0 0;
  }