/* --------
  The CSS rules offered here are just an example, you may use them as a base. 
 --------- */
* {margin:0; padding:0}
/* --- Page Structure  --- */
html {height:100%}
body {
  min-width:300px;
  width:100%;
  height:100%;
  background:#fff;
  color:#333;
  font-family:"微軟正黑體";
  text-align:center
}
#wrapper{
  margin:0 auto;
  text-align:left
}
#content {
  width:95%;
  margin:0 auto;
  padding-bottom:20px;
  overflow:hidden
}
.demo {
  margin:1.5em 0;
  padding:0.5em 0.5em 0.25em;
  border:1px solid #ccc;
  position:relative;
  overflow:hidden;
  background-color:#fbfbfb
}
.collapse{
	display:block;
	width:95%;
	margin:0 auto;
	}
.collapse p {padding:0px; margin:5px; font-size:1.2em}
.collapse p2 {display:block; padding:0px; margin:5px; max-width:620px; width:95%}
.collapse p2 img {border:1px solid #ccc; padding:5px; margin:0px;  width:100%; height:auto;}
.collapse p2 iframe{ border:1px solid #ccc; padding:5px; margin:0px;  z-index:9999; position:relative; width:100%; min-height:300px}
h3{font-size:1.6em}
.collapse h5{ font-weight:normal; font-size:1em; color:#999; margin-bottom:10px}
.collapse h6{ font-weight:normal; font-size:1em; color:#999; line-height:1em;}
.collapse a {display:block; color:#0067b5; text-decoration:none; font-size:1.2em; margin:5px;
				transition: color 1s;
				-webkit-transition: color 1s; /* Chrome & safari */
				-moz-transition: color 1s; /* firefox */
				}
.collapse a:hover { color: #ff9900; text-decoration:none; }

.switch {position:absolute; top:1.5em; right: 1.5em; padding:3px}

.post .switch {position:static; text-align:right}

.post .main{margin-bottom:.3em; padding-bottom:0}

.other li, .summary {margin-bottom:.3em; padding:1em; border:1px solid #e8e7e8; background-color:#f8f7f8}

.other ul {list-style-type:none; text-align:center}

/* --- Headings  --- */
h1 {
  font-family: "微軟正黑體"; 
  font-size:2.8em; 
  font-weight:normal; 
  color:#004389;
}
h2 {margin-bottom:1em; padding:3px; font-weight:normal; font-size:1.6em; text-indent:10px; color:#fff; line-height:40px;
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzFlNTc5OSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3ZGI5ZTgiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top, #1e5799 0%, #7db9e8 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(100%,#7db9e8)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #1e5799 0%,#7db9e8 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #1e5799 0%,#7db9e8 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #1e5799 0%,#7db9e8 100%); /* IE10+ */
background: linear-gradient(to bottom, #1e5799 0%,#7db9e8 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 ); /* IE6-8 */
background-color:#1e5799; /* Old browsers */
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
h3{font-size:1.4em}
h4{ clear:both; display:block; width:100%; font-size:1.4em; line-height:40px; font-weight:normal; border-bottom:1px #999 dotted; margin-bottom:10px}
.collapse h4 img{ vertical-align:text-bottom}

.expand{padding-bottom:.25em; clear:both}

/* --- Links  --- */
a:link, a:visited {
  border:1px dotted #ccc;
  border-width:0;
  text-decoration:none;
}
a:hover, a:active, a:focus {
  border-style:solid;
  text-decoration:underline;
  outline:0 none
}
a:active, a:focus {

}
.expand a {
  display:block;
  width:95%;
  margin:0 auto;
  padding:3px 10px;
  color:#000;
  background-color:#fff;
  font-weight:normal;
  text-decoration:none;
  transition: all 1s;
  -webkit-transition: all 1s; /* Chrome & safari */
  -moz-transition: all 1s; /* firefox */
}
.expand a:link, .expand a:visited {
  border-width:1px;
  background-image:url(images/arrow-down.gif);
  background-repeat:no-repeat;
  background-position:98% 50%;
}
.expand a:hover, .expand a:active, .expand a:focus {
}
.expand a.open:link, .expand a.open:visited {
  border-style:solid;
  background:#94bbc4 url(images/arrow-up.gif) no-repeat 98% 50%;
  color:#fff;
}