<style TYPE="text/css">

body, html {
    height: 100%;
}

body.bg { 
    /* The image used */
    background-image: url("../images/activity/20260507/20260507-bkgd.png");

  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
	
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
	
  /* Set up positioning */
 /* position: fixed;*/
  top: 0;
  left: 0;

  /* Full height */
	margin: 0px;
	padding: 0px;

    /* Center and scale the image nicely */
	background: url(../images/activity/20260507/20260507-bkgd.png) no-repeat center center; 
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
	-webkit-background-size: 100%;
	-moz-background-size: cover;
	-o-background-size: cover;
 }

P.content {font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:12pt; line-height: 22px; text-align: justify; }

table P.content {font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:12pt; line-height: 22px; text-align: justify; }

/* Heading font */ 

table P.title1a {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:25pt; line-height: 30px; font-weight: bold; text-align: center; color: #f15a29; text-shadow: 1px 1px 2px white;}

table P.title1b {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:20pt; line-height: 30px; font-weight: bold; text-align: center; color: #ffffff; text-shadow: 1px 1px 2px black;}

table P.title2 {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:15pt; line-height: 28px; font-weight: bold; text-align: center; color: #fff100; text-shadow: 1px 1px 2px black;}

table P.title3 {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:14pt; line-height: 27px; font-weight: bold; text-align: right; color: #ffffff; text-shadow: 1px 1px 2px black;}

table a.title2:link  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:15pt; line-height: 28px; font-weight: bold; text-align: right; color: #ffffff; text-decoration: none;}

table a.title2:visited  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:15pt; line-height: 28px; font-weight: bold; text-align: right; color: #ffffff; text-decoration: none;}

table a.title2:hover  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:15pt; line-height: 28px; font-weight: bold; text-align: right; color: #ffffff}

table a.title2:active  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:15pt; line-height: 28px; font-weight: bold; text-align: right; color: #ffffff; text-decoration: none;}

table a.title3:link  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:14pt; line-height: 27px; font-weight: bold; text-align: right; color: #ffffff; text-decoration: none;}

table a.title3:visited  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:14pt; line-height: 27px; font-weight: bold; text-align: right; color: #ffffff; text-decoration: none;}

table a.title3:hover  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:14pt; line-height: 27px; font-weight: bold; text-align: right; color: #ffffff}

table a.title3:active  {font-family: Arial, Verdana, Helvetica, PMingLiU, MingLiU; font-size:14pt; line-height: 27px; font-weight: bold; text-align: right; color: #ffffff; text-decoration: none;}


table {
	font-family: Arial, Verdana, Helvetica; font-size:12pt; line-height: 22px;	
}

table.subtitle {
	font-family: Arial, Verdana, Helvetica; font-size:15pt; line-height: 22px;
	text-align: left;
}

/* Subtitle */ 
table font.subtitle {
	color: black;
	font-family: Arial, Verdana, Helvetica, 新細明體, PMingLiU, MingLiU; font-size:15pt; line-height: 22px; text-align: left; font-weight: bold; letter-spacing: 0.5px;
	text-align: left;
	color: #0b4b3a;
}

table a.subtitle:link {
	color: #848484; 
	font-family: Arial, Verdana, Helvetica; font-size:18pt; line-height: 22px; text-align: left; font-weight: bold; letter-spacing: 0.5px;
}

table a.subtitle:visited {
	color: #848484; 
	font-family: Arial, Verdana, Helvetica; font-size:18pt; line-height: 22px; text-align: left; font-weight: bold; letter-spacing: 0.5px;
}

table a.subtitle:hover {
	color: #848484; 
	font-family: Arial, Verdana, Helvetica; font-size:18pt; line-height: 22px; text-align: left; font-weight: bold; letter-spacing: 0.5px;
}

table a.subtitle:active {
	color: #848484; 
	font-family: Arial, Verdana, Helvetica; font-size:18pt; line-height: 22px; text-align: left; font-weight: bold; letter-spacing: 0.5px;
}

/* Table */
table.content {
	border: 1px solid black;
	border-collapse: collapse;
	background-color: #0b4b3a;
	color: white;
}
th.content {
	text-align: left;
	padding: 10px;
	background-color: #049b41;
	color: white;
}

td.content {
	text-align: left;
	padding: 10px;
	background-color: #8bd8a6;
	color: white;
}

th, td {
  padding: 8px;
}

tr.content:nth-child(even){background-color: #f1eada; color: #000000}

table p.content{
	font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica, 新細明體, PMingLiU, MingLiU; font-size:11pt; line-height: 22px; text-align: justify; letter-spacing: 0.5px;
}

table li{
	font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica, 新細明體, PMingLiU, MingLiU; font-size:11pt; line-height: 22px; text-align: justify; letter-spacing: 0.5px;
}

table a:link{
	font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica; font-size:11pt; line-height: 22px; text-align: justify; letter-spacing: 0.5px;
}
table a:visited {
	font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica; font-size:11pt; line-height: 22px; text-align: justify; letter-spacing: 0.5px;
}
table a:hover {
	font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica; font-size:11pt; line-height: 22px; text-align: justify; letter-spacing: 0.5px;
}
table a:active{
	font-family: 'Trade Gothic W01 Bold 2',Arial, Verdana, Helvetica; font-size:11pt; line-height: 22px; text-align: justify; letter-spacing: 0.5px;
}

table.program {border-collapse: collapse;}

th, td .program{
    text-align: left;
    padding: 5px;
}

th, td .program1{
    text-align: center;
    padding: 5px;
}

tr .program:nth-child(even){background-color: #f2f2f2}
 
/* Heading */

table.header{
	background-color: #ffffff; 
}

table.headerb {
	background-color: #ffffff; 
	width: 100%;
}

div#header img.bg {
    display: block;
	position: absolute;
	margin-left: auto;
    margin-right: auto;
	top: 0;
	left: 50%;
    margin-right: -50%;
    transform: translate(-50%);
}

/* menu */

#header {
display:table; /* centers modern browsers */
margin:0 auto; /* centers modern browsers */
text-align:center; /* centers IE6/7 */
}

#header p.space {
    line-height: 16;
}

#header hr {
width: 100%;
height: 1px;
margin-left: auto;
margin-right: auto;
background-color:#000000;
color:#000000;
border: 0 none;
margin-top: 3px;
margin-bottom:3px;
}

#header ul {
	width: 100%;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #ffffff;
	text-align: center;
	display: inline-block;
}

#header li {
	display:inline;
    float: left;
    border-right:1px solid #bbb;
}

#header li:last-child {
    border-right: none;
}

#header li a {
    display: block;
    color: #000000;
    text-align: center;
    padding: 4px 9px;
    text-decoration: none;
}

#header li a:hover:not(.active) {
    background-color: #ffffff;
    text-decoration: underline;
}

#header .active {
    background-color: #ffffff;
}

/* Footer */

.footer{
    background-image: url("../workshop/images/dsdl2018-footer.png");
    background-position: left 95%; 
    background-repeat: no-repeat;
    height: 28px;
}

div#footer img.logo {
	width: 200;
}

div#footer img.logo2 {
	width: 180;
}

font.end {text-decoration: none; color: #ffffff; font-family: Arial, Verdana; font-size:8pt}

table.footer {
	font-size	: 8pt;
	color: #ffffff;
	background-image: linear-gradient(to right, #000000, #000000);
	width: 100%;
}

table.footerb {
	font-size	: 8pt;
	color: #ffffff;
	width: 800;
}

table a.end:link{
	color: #ffffff; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; 
}
table a.end:visited {
	color: #ffffff; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; 
}
table a.end:hover {
	color: #f9dee0; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; text-decoration: underline;
}
table a.end:active{
	color: #ffffff; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; 
}

table a.end1:link{
	color: #ffffff; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; 
}
table a.end1:visited {
	color: #ffffff; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; 
}
table a.end1:hover {
	color: #f9dee0; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; text-decoration: underline;
}
table a.end1:active{
	color: #ffffff; font-family: Arial, Verdana, Helvetica; font-size:8pt; line-height: 10px; 
}

</style>
