﻿/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Jun 20, 2016, 9:56:46 AM
    Author     : chin_
*/

.html, body{
    margin: 0px;
    padding: 0px;
    background-color: #E2E5EC;
    font-family: "Nimbus Sans L","URW Gothic L",Verdana,Tahoma,Helvetica,"Lucida Grande",Geneva,"DejaVu Sans","Microsoft Sans Serif", "Microsoft JhengHei", "微軟正黑體", sans-serif;
}

p{
    padding-bottom: 1em;
}
h1{
    font-size: large;
    color: #fff;
}
h3{
    padding-top: 1em;
    font-size: large;
    color: #1B539B;
}
h4 {
    padding-top: 1em;
    font-size: medium;
    font-weight: bold;
    color: black;
}
.clearfix:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}
.no-padding {
	padding: 0px !important;
}
.padding5px{
    padding-left: 15px;
    padding-right: 15px;
}
.text-underline{
    text-decoration: underline;
}
a.anchor {
    display: block;
    position: relative;
    top: -60px;
    visibility: hidden;
}
a:hover{
    text-decoration: inherit;
}
.bgwhite{
    background-color: white;
}
.border1{
    border: solid 1px #000;
}
.bordertop1{
    border-top: solid 1px #000;
}
.proc{
    margin: 0 auto;
}
.proc tr, .proc td, .proc table, .proc th{
    border: solid 1px #EDAB00;
    text-align: center;
	padding: 5px;
	background-color: white;
	background-position: center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
.proc th{
    border: 1px solid #e8bd16;
}
.headcontainer{
    margin-top: 20px;
    background-color: #1B539B;
    text-align: center;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    padding: 5px;
}
.headcontainer h1{
    margin: 5px;
}
.bodycontainer{
    background-color: white;
    padding-left: 2.5em;
    padding-right: 2.5em;
    padding-top: 2em;
    padding-bottom: 1em;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
}
table.proc {
	margin-bottom: 2em;
}

.proc .number {
	text-align: right;
}

caption {
	color: #1B539B;
    padding-left: 2em;
    padding-right: 2em;
    caption-side: bottom;
    text-align: center;
}
.taiwan {
    text-align: center;
    margin-bottom: 20px;
    border: solid 1px #EDAB00;
    padding: 0px;
}

.taiwan > div:first-child{
    padding: 5px;
    color: black;
    background-color: #EDAB00;
    font-weight: bold;
    margin-bottom: 1px;
}

.taiwan > div {
    padding: 5px;
}


#taiwan_year_div {
    padding: 10px;
    height: 70px;
}


figure {
	width: 100%;
	margin-bottom: 2em;
}

figure figcaption {
	color: #1B539B;
    padding-left: 2em;
    padding-right: 2em;
    padding-top: 0em;
    text-align: center;
}

.proc-stripped tbody tr:nth-child(odd){
    background-color: #f2f2f2;
}
.proc-stripped tbody tr:nth-child(even){
    background-color: #ccc;
}
.proc th{
    background-color: #EDAB00;
	color: black;
    padding-top: 5px;
    padding-bottom: 5px;
}

.proc0b1 {
    padding: 1px 1px 1px 1px;
}


.proc0b1 > p {
    padding-left: 1em;
    padding-right: 1em;
    margin: 0px 0px 0px 0px;
}

.proc0b1 > p:first-of-type {
    padding-top: 1em;
}

.proc0b1 > p:last-of-type {
    padding-bottom: 1em;
    margin-bottom: 1em;
}

.proc0b1a > p {
    border-left: 1px solid #B583B3;
}

.proc0b1b > p {
    border-left: 1px solid #CF6C99;
}

.proc0b1c > p {
    border-left: 1px solid #E39724;
}

.proc1{
    margin: 0 auto;
}

.proc1 td {
	width: 14%;
}

.proc1 tr {
	background-color: white !important;
}

.proc1 tbody tr:nth-child(1) {
	height: 100px;
}

#proc1a > [class*='col-'], #proc1a > figure > [class*='col-'] {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
}

.proc1a {
    padding: 4px 4px 4px 4px;
    display: flex;
    flex-direction: column;
}

.proc1a > div {
    width: 100%;
    min-height: 100%;
    height: 131px;
    border-radius:15px; 
    background-color: #ffe6cc; 
    display: block;
    float: left;
    padding-right: 1em;
    box-shadow: 0px 4px 4px #cfb69c;
}

.proc1a > div > div {
    width: 120px; 
    height: 130px; 
    float: left; 
    border-bottom-left-radius: 15px; 
    border-top-left-radius: 15px; 
    margin-right: 1em;

    background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

.proc1a > div > h4 {
    padding-top: 0px;
    font-size: medium;
}

.proc1a > div > p {
    overflow: hidden;
}

.proc1a0 {
    padding-bottom: 2em;
}

.proc1a0 > div {
    border: solid 3px #EDAB00;
	width: 125px;
	height: 125px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	box-shadow: 0 0 8px rgba(0, 0, 0, .8);
	-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
	-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);

    background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
	}

.proc1a0 > div > h4 {
    position: absolute;
    width: 125px;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 40px;

    background-color: white;
    opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
	}

.proc1a0 > div > p {
    padding: 0px 0px 0px 0px;
    position: absolute;
    width: 104px;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-left: 7px;
    margin-right: 5px;
    top: 110px;
    text-align: center;
    background-color: #EDAB00;
	}


.proc1b {
    padding-left: 1em;
    padding-right: 1em;
    padding-top: 1em;
    padding-bottom: 1em;
    background-color: #ffe6cc;
}

.proc1b .proc1bdetect {
    background-color: white;
    border: 1px solid #EDAB00;
}

.proc1b h4 {
    font-weight: bold;
    text-align: center;
}

.proc1b .proc1bcap {
    padding-left: 2px;
    padding-right: 2px;
}

.proc1b .proc1bcap > div {
    width: 100%; 
    height: 120px;

    background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

.proc1b .proc1bcap > p {
    text-align: center;
}

.proc1b .proc1bresult {
padding: 1em 1em 1em 3em;
width: 200px;
}

.proc1b .proc1bresult p {
    text-align: left;
}

.proc1b .proc1bresult > div {
padding: 5px 5px 5px 5px; 
border: 1px solid black; 
display: inline-block; 
box-shadow: 4px 4px 4px #888888; 
-ms-transform: rotate(7deg); /* ie 9 */
    -webkit-transform: rotate(7deg); /* safari */
    transform: rotate(7deg);
    background-color: white;
}


.proc1b{
    margin: 0 auto;
    width: 100%;
}

.proc1b tbody tr {
	height: 114px;
}

.proc1b th:nth-child(2){
    max-width: 169px;
}

.proc1c {
    
}
.proc1c > div > div{
    padding: 4px 4px 4px 4px;
    background: #ffe6cc;
    border: solid 2px white;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    height: 200px;
}
.proc1c > div > div > h4 {
    padding-top: 0em; 
    text-align: center;
}
.proc1c-empty {
    background-color: #F2F0E1;
    color: darkred;
    width: 100% !important;
    text-align: center;
    padding-top: 1em;
    padding-left: 25%;
    padding-right: 25%;
}
.proc1c > div > div > div {
    width: 48%; 
    height: 80px;
    display: inline-block;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.proc3 tbody tr:last-child td {
	border-top: solid 2px #EDAB00;
}

.proc3 tbody tr td:last-child {
}

.proc3 tbody tr:last-child td {
	background-color: #FFE5C1;
}

.proc4d > div {
    display: inline-block;
    width: 19%;
}

.proc4d > div > img {
  -ms-transform: perspective(50em) rotateY(-30deg);
  -webkit-transform: perspective(50em) rotateY(-30deg);
  transform:  perspective(50em) rotateY(-30deg);
  width: 100%;
}

.proc4d > div > p {
    margin-left: .5em;
    margin-right: .5em;
    text-align: center;
    background: #EDAB00;
    padding: 4px 4px 4px 4px;
    border-radius: 4px;
    font-size: x-small;
    white-space: nowrap;
}

#proc6e table {
    table-layout: fixed;
    width: 100%;
}

#proc6e img[usemap] {
    width: auto;
    height: auto;
    max-width: 100%;
}
#proc6e .proc6e_item {
    width: 25%;
    height: auto;
    border: 3px solid white;
}

#proc6e .proc6e_item.selected {
    border: 3px solid red;
}

.wrap{
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
.wrap > div{
    display: inline-block;
    min-width: 155px;
    background-color: #fff;
    margin: 1px;
    padding: 0px;
}
.wrap > div div:nth-child(2){
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #FFE5C1;
}

.form-body p {
     padding: 3em 2em 2em 2em;
}

.form-body h3 {
    text-align: center;
}

/* reponsive table */
/*
.newstable table { 
    width: 100%; 
    border-collapse: collapse; 
}

.newstable tr:nth-of-type(odd) { 
    background: #eee; 
}
.newstable th { 
    background: #fff;  
    font-weight: bold; 
}
.newstable td,.newstable  th { 
    padding: 6px; 
    border: 1px solid #ccc; 
    text-align: left; 
}
.newstable td:nth-of-type(1),.newstable th:nth-of-type(1){
    width: 5%;
}
.newstable td:nth-of-type(2),.newstable th:nth-of-type(2){
    width: 15%;
}
.newstable td:nth-of-type(3),.newstable th:nth-of-type(3){
    width: 10%;
}
.newstable td:nth-of-type(4),.newstable th:nth-of-type(4){
    width: 35%;
}
.newstable td:nth-of-type(5),.newstable th:nth-of-type(5){
    width: 35%;
}
*/
/* Search Form */

.form-head{
    background-color: #1B539B;
    color: white;
    font-size: 20px;
    padding: 5px 5px 0px 5px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}
.form-body{
    position: relative;
    background-color: white;
    padding: 0px 15px 15px 15px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}
.form-checkbox{
    padding-left: 5px;
}

.circle{
    border: solid 1px #ccc;
}
.form-padding{
    padding-top: 6px !important;
    text-align: center;
    margin-top: 0px;
    border-radius: 5px;
}

.table-wrapper { 
    overflow-x:scroll;
    overflow-y:visible;
    width:200px;
    padding-left:  50px;
    background-color: orange;
}
/* map */
.heading{
    padding: 5px;
    border-bottom: none;
    text-align: center;
    background-color: #1B539B;
    color: white;
}
.wrapper{
    background-color: purple;
}
.container1 {
  overflow: hidden;
  width: 100%;
  border-left: solid 1px #000;
  border-right: solid 1px #000;
  border-bottom: solid 1px #000;
}
.left-col {
  float: left;
  width: 20%;
  background-color: white;
  padding-bottom: 500em;
  margin-bottom: -500em;
}
.right-col {
  float: left;
  width: 80%;
  margin-right: -1px; /* Thank you IE */
  border-left: 1px solid black;
  background-color: white;
  padding-bottom: 500em;
  margin-bottom: -500em;
}
.top1{
    border-bottom: 1px solid black;
    padding: 5px;
}
.top2{
    padding: 5px;
}
.right-top{
    padding: 5px;
    border-bottom: 1px solid #000;
}
.right-bottom{
    padding: 2px;
}
.right-col-full{
    width: 100%;
    background-color: white;
    padding: 10px;
}
.hideme{
    display:none;
}
.hide-bullet > li:nth-child(even){
    list-style: none;
    background-color: #BFC0C0;
}
.hide-bullet > li:nth-child(odd){
    list-style: none;
    background-color: #BFC0C0;;
}
.hide-bullet li{
    list-style: none;
    background-color: white;
}
/* Header */

.header-top {
    background: linear-gradient(60deg, #f5f4f4 0%, #f5f4f4 100%);
    background-color:#f5f4f4\9;
}

.header-top:after { 
   content: " ";
   display: block; 
   height: 0; 
   clear: both;
}

.headerimg {
	/*object-fit: cover;
    overflow: hidden;
	width: 100%;*/
background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

.header-top .title {
	font-size: 28px;
	font-weight: bold;
	color: white;
	margin-top: 1em;
	margin-left: 90px;
}

.header-top .subtitle {
	width: auto;
	text-align: left;
	color: white;
	font-size: 16px;
	float: left;
	margin-left: 90px;
	margin-bottom: 1.25em;
}

/* Language buttons */
.lang {
	float: right;
	margin-right: 1em;
}

.lang .item {
	display: inline-block;
}

.lang_btn {
	width: 24px;
	height: 24px;
}

/* Navigation bar */
nav.affix {
    position: fixed;
    top: 0;
    width: 100%;
	left: 0;
}

nav {
    background: linear-gradient(60deg, #2FA1A1 0%, #1B539B 100%);
    background-color:#1B539B\9;
}

.navbar-default {
	margin-bottom: 0px;
	border: none;
}
.navbar-default .navbar-nav > li > a {
    color:#fff;
}
.navbar-default .navbar-nav > li > a:hover {
    color:#000;
    background-color: #808080;
}
.navbar-default .navbar-nav > .active > a, .navbar-nav > .active > a:hover, .navbar-nav > .active > a:focus {
    color: #ffffff;
    background-color:black;
}

.navbar-default .navbar-brand {
    color:#eeeeee;
}
/* sidenav proc.html */

.navi.affix{
    position: fixed;
    top: 50px;
    width: 234px;
    left: inherit;
    z-index: 1000;
    color: inherit;
}
.navi{
    background: inherit;
}
.navi ul {
    background: #92DDE8;
}

.navi > ul > li > a {
    font-weight: bold;
}

.navi > ul > .active {
    background: #1B539B;
}

.navi > ul > .active > a{
    background: #1B539B;
    color: #fff;
}

.navi ul > li > a{
    color: #000;
    padding-left: 15px;
    padding-top: 7px;
    padding-bottom: 7px;
}
.navi ul > li > ul > .active > a {
    background: #1B539B;
    color: #fff;
}

.navi ul > li > a:hover {
    background: #808080;
}

.navi > ul > li > ul > li {
	padding-left: 1.3em;
}

.navi > ul > li > ul > li > a {
    padding-top: 2px;
    padding-bottom: 2px;
    color: #0B336B;
}

.padding-top-spacer{
    padding-top:20px;
}
/* sticky table columns */
.table-scroll{
    width: 100%;
    background-color: white;
}
.table-scroll tr:nth-child(even){
    background-color: #FFE9D1;
}

.table-scroll th{
    background-color: #EDAB00;
    border: solid 1px #EDAB00;
    padding: 5px;
    text-align: center;
    color: black;
}

.table-scroll thead tr:nth-child(2) th {
    background-color: #FFE9D1;
    border-bottom: 2px solid #EDAB00;
}

.table-scroll td{
	padding-top: 3px;
	padding-bottom: 3px;
	border: 1px solid #EDAB00;
    text-align: center;
    overflow: hidden;
}
.table-scroll td:nth-child(2){
    min-width: 200px;
    max-width: 200px;

}
.table-scroll th:nth-child(1){
    min-width: 20px;
    overflow: hidden;
}
.table-scroll th:nth-child(2){
    max-width: 200px;
    height: 25px;
}
.table-scroll tr:nth-child(2) th:nth-child(n+3) {
    min-width: 90px;
}
.table-scroll tbody tr td:nth-child(n+3), .table-scroll tfoot tr td:nth-child(n+3) {
    text-align: right;
    padding-right: 1em;
}

.table-responsive {
    overflow-x: auto !important;
}

.table-responsive>.fixed-column {
  position: absolute;
  display: inline-block;
  width: auto;
  border-right: 1px solid #ddd;
}

@media(min-width : 958px) {
    .table-responsive > .fixed-column {
        visibility: hidden;
    }
}


.table-scroll thead tr th, .table-scroll tfoot {
	border-top: 2px solid #EDAB00;
    background-color: #EDAB00;
}

.table-scroll tbody tr td:nth-child(2) {
	text-align: left;
	padding-left: 1em;
}

.table-scroll tfoot td {
	padding-top: 5px;
	padding-bottom: 5px;
	font-weight: bold;
  
}

.table-scroll tbody tr td:first-child {
	font-weight: bold;
}


/*-- change navbar dropdown color --*/
@media(max-width:767px){
.navbar-default .navbar-nav .open .dropdown-menu>li>a,.navbar-default .navbar-nav .open .dropdown-menu {
	color:#ffffff;
}
}

/* Body */
#content {
    background-color: #f5f4f4;
	padding-top: 40px;
	padding-bottom: 40px;
}

.row.content-body {
	display: -webkit-flex;
	-webkit-flex-wrap: wrap;
	display: flex;
	flex-wrap: wrap;
}

.row.content-body > div[class*='col-'] {
	display: -webkit-flex;
	-webkit-flex-direction: column;
	display: flex;
	flex-direction: column;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-left: 15px;
	padding-right: 15px;
}

.row.content-body > div[class*='col-'].margin-left {
	margin-top: 0px;
	margin-bottom: 0px;
}

.row.content-body > div[class*='col-'].margin-right {
	margin-top: 0px;
	margin-bottom: 0px;
}

.row.content-body > div[class*='col-'].margin-left:after {
	content: '';
	border-right: white 1px solid;
	width: 50%;
	height: 100%;
	transform: translateX(75%);
}

.row.content-body > div[class*='col-'].margin-right:before {
	content: '';
	border-left: white 1px solid;
	width: 50%;
	height: 100%;
	transform: translateX(25%);
}

.panel-height{
    height: 215px;
}
.panel-height2{
    height: 290px;
}

.panel {
    position: relative;
	border: none;
	/*
	-webkit-border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	border-radius: 0 !important;
	*/
    min-height: 100%;
}

.panel > .panel-heading {
	color: #203283;
	font-size: larger;
	padding-top: 1em;
}

.panel > .panel-footer {
	text-align: right;
	background: none;
	border: none;
	padding-bottom: 0px;
	padding-right: 0px;
	position: absolute;
	bottom: 0px;
	right: 15px;
}

.panel > .panel-footer .btn {
	background-color: #BFC0C0;
	color: #203283;
	border: none;
	-webkit-border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	border-radius: 0 !important;
}

.panel .btn:hover {
	background-color: #7F8080;
}

.panel > .panel-body {
	padding-top: 0px;
	padding-bottom: 0px;
}

.panel > .panel-body ul {
	padding-left: 1em;
	margin-bottom: 0px;
}

/*
.panel-hasmore > .panel-heading {
	border-bottom: #65C4D3 1px solid;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 15px;
	margin-right: 15px;
	margin-bottom: 2em;
}
*/

.panel-hasmore > .panel-heading {
	background-color: 	#697723;
	color: white;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
}

.panel-hasmore > .panel-body {
	padding-left: 0px;
	padding-right: 0px;
}

.panel-hasmore > .panel-body ul {
	list-style: none;
	padding-left: 0px;
	padding-right: 0px;
}

.panel-hasmore > .panel-body li {
	border-bottom: black 1px dotted;
	padding: 0px;
}

.panel-hasmore > .panel-body li:last-child {
	border-bottom: none;
}

.panel-hasmore > .panel-body a {
	text-decoration: none;
	width: 100%;
	min-height: 100%;
	display: inline-block;
	padding: 8px 16px 8px 16px;
}

.panel-hasmore > .panel-body a:focus {
	text-decoration: underline;
}

.panel-hasmore > .panel-body a:hover {
	text-decoration: none;
	background-color: #4594A3; 
	color: white;
}

#proc .panel-hasmore > .panel-body {
	text-align: center;
}

#public .panel-heading {
	text-align: center;
}

#public .panel-body {
	padding: 20px 20px 0px 20px;
}

#public .panel-footer {
	width: 100%;
	padding-left: 30px;
}

#public panel-footer .btn {
	width: 100%;
}

/*
.panel-isstatic > .panel-body.full-span {
	display: table;
}

.panel-isstatic > .panel-body .bigbutton {
	background-color: #65C4D3; 
	border-radius: 20px;
	display: table-cell;
	width: 48%;
	color: #283F73;
	font-weight: bold;
	padding: 10px 20px;
	text-align: center;
}

.panel-isstatic > .panel-body .bigbutton > div {
	text-align: left;
	margin-top: 20px;
}
*/

#public .panel-body .bigbutton {
	background-color: 	#CCCC4D; 
	border-radius: 20px;
	color: #283F73;
	font-weight: bold;
	padding: 10px 20px;
	display: inline-block;
	width: 100%;
}

#public .panel-body .bigbutton > div {
	display: inline-block;
	vertical-align: middle;
	padding-left: 20px;
}

#public .panel-body .bigbutton img {
 	width: 36px; 
	height: 36px;
}

#public .panel-body .bigbutton:hover, #public .panel-body .bigbutton:focus {
	background-color: #808000; 
	color: white;
	text-decoration: none;
}

/* Footer */

.footer{
	padding-top: 2em;
	padding-bottom: 2em;
}

.footer .copyright {
}

.footer .counter {
    padding-left: 5em;
	padding-right: 5em;
}

.footer .counter > div > img {
    width: 100%;
    height: auto;
    margin-bottom:1em;
}

.footer .counter div > span {
	display: inline-block; 
	vertical-align: top;
	text-align: left;
}

/* custom sizes */

@media only screen and (max-width : 767px) {
	.headerimg.height1 {
		height: 80px;
	}
	
	.headerimg.height2 {
		height: 120px;
	}

	.headerimg.height3 {
		height: 200px;
	}
}

@media only screen and (min-width : 768px) {
	.header-top-body {
		padding-right: 3em;
	}

	.navbar-nav {
		width: 100%;
		text-align: center;
	}

	.navbar-nav > li {
		float: none;
		display: inline-block;
	}
	
	.headerimg.height1 {
		height: 130px;
	}
	
	.headerimg.height2 {
		height: 190px;
	}
	
	.headerimg.height3 {
		height: 320px;
	}

}

@media only screen and (min-width : 320px) and (max-width : 990px) {
	.row.content-body {
		padding-left: 5%;
		padding-right: 5%;
	}
}


@media only screen and (min-width : 1024px) {
	body {
		min-width: 1024px;
		max-width: 1100px;
		margin-left: auto;
		margin-right: auto;
	}
}

.newstable .row div {
	text-align: left;
}

.newstable .row div:first-child {
	text-align: left;
}

.newstable .row {
	margin-left: 5px;
	margin-right: 5px;
	padding-top: 1em;
	border-bottom: black 1px dotted;
}

.newstable .row div:nth-of-type(5) {
	padding-bottom: 1em;
	padding-left:   5em;
	border-top:  thin solid #CCC; 
}

.newstable .btn {
	float: right;
	background-color: #BFC0C0;
	color: #203283;
	border: none;
	-webkit-border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	border-radius: 0 !important;
}

/* repsonsinve table */
@media only screen and (max-width: 768px){

	.newstable .row div:before {
		font-weight: bold;
		width: 10em;
		display: inline-block;
	}
	
	.newstable.zh .row div:nth-of-type(1):before { content: "序號"; }
	.newstable.zh .row div:nth-of-type(2):before { content: "訊息類型"; }
	.newstable.zh .row div:nth-of-type(3):before { content: "公佈日期"; }

	.newstable.en .row div:nth-of-type(1):before { content: "ID"; }
	.newstable.en .row div:nth-of-type(2):before { content: "Message Type"; }
	.newstable.en .row div:nth-of-type(3):before { content: "Date"; }

	.newstable .row div:nth-of-type(4) { font-weight: bold; padding-top: 1em; padding-bottom: 1em; }
	        
	.newstable .row div:nth-of-type(5) { 
		padding-top: 0em;
		padding-left: 4em; 
		padding-bottom: 2em;
		display: block !important;
		float: none !important;
		border-top: none;
		height: auto !important;
	}
	

	.newstable .btn {
		visibility: collapse;
	}

	        /* map */
        .left-col{
            display: none;
        }
        .right-col{
            width: 100%;
        }
        .hideme{
            display: inherit;
        }

}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .row.content-body > div[class*='col-'].margin-left:after {
        content: '';
        border-right: white 0px solid;
        width: 50%;
        height: 100%;
        transform: translateX(75%);
    }

    .row.content-body > div[class*='col-'].margin-right:before {
        content: '';
        border-left: white 0px solid;
        width: 50%;
        height: 100%;
        transform: translateX(25%);
    }    
}
.ModalPopupBG
{
    background-color: #666699;
    filter: alpha(opacity=50);
    opacity: 0.7;
}