/*
 * GOC css by Vincent
 *
 * 2008/01/xx all 4 goc
 * 2008/02/21 add jquery Greybox css
 * 2008/05/21 change 2 GARMIN connet Layout
 * 2008/05/22 split movies / news 2 template files, but use the same css/js
 */


html,body{margin:0;padding:0;}
body{font: 100% arial,sans-serif;/*padding:0px 2px;height:100%;*/}
p{margin:0 10px 10px}

.aln-center {display:block;margin:0 auto}
.w200 {width:200px;}
.clr {clear:both}
form {margin:0;}
/*#loading-indicator {font:normal 12px arial;background: #339900;color:white;padding:2px;position:absolute;top:0;right:2px;width:auto;}*/

#loading-indicator {font:normal 12px arial;background: #FF8000;color:white;padding:2px;position:absolute;top:200px;left:370px;width:auto;z-index:5}


#leclose {float:right;cursor:pointer;}
#tips {background:#85A4C5;padding:2px 10px;margin:8px 5px; font:normal 12px arial;color:#000;display:block;/*float:left;*/width:auto;}

.font10  {font:normal 10px Arial, Helvetica, sans-serif;}
.font12  {font:normal 12px Arial, Helvetica, sans-serif;}
.font13  {font:normal 13px Arial, Helvetica, sans-serif;}
.font15  {font:normal 15px Arial, Helvetica, sans-serif;}
.font16b {font:bold 16px Arial, Helvetica, sans-serif;}
.font18b {font:bold 18px Arial, Helvetica, sans-serif;}

.card-l,.card-r{width:325px;margin:0 2px 5px;padding:0;font-size:12pt;}
.card-r{float:right;margin:0 0 15px 15px;}
.card-title{margin:0 0 2px 0;font-size:12pt;max-width:325px;}
.card-photo {background:url(/connect/images/goc/loading-s.gif) no-repeat center}
.card-photo img{border:none;border:1px solid #C0C0C0;width:120px;padding:2px;float:right;}
.card-desc{margin:5px; padding:0;text-align:left;font-size:9pt;}
.card-info{margin:5px; padding:0;text-align:right;font-size:9pt;color:#666;}

.clear{clear:both;}

div#header {height:50px;margin:0 0 2px 0; padding-left:10px;background: #7698BD;}
div#header h1 {line-height:50px;color: #FFFFFF;float:left;margin:0;background:url(/connect/images/goc/onlinecenter_exe_icon_128_2-.gif) no-repeat;padding-left:48px}
div#content p{line-height:1.4}
div#navigation{background:#fff}
div#extra{background:#fff}
div#footer{background: #333;color: #FFF; font-size:76%}
div#footer p{margin:0;padding:5px 10px}

div#wrapper{float:right;width:100%;margin-left:-282px;}
div#content{margin-left:282px}
div#navigation{float:left;width:280px;height:100%}
div#extra{float:left;clear:left;width:280px}
div#footer{clear:both;width:100%;height:26px;}

div#o-map {background:#99B3CC;width:100%;padding:5px 0 0 0;} 
div#gg-map {width: 100%; height: 350px;margin:0;}
/* btn Download */
#btn-dl-news,#btn-dl-news-clr,#reset {cursor:pointer;}

#reset {background:url(/connect/images/goc/zoom-all-gray.gif) no-repeat;width:16px;height:16px;float:left}
#info_stats {background:url(/connect/images/goc/arrow-right-gray.gif) no-repeat;padding-left:16px;width:16px;height:16px;float:left;width:auto;margin-left:3px;}

#btn-pnd-movie {background: url(/connect/images/goc/btn-movie_news-download.jpg) no-repeat 0 0;}
#btn-pnd-news {background: url(/connect/images/goc/btn-movie_news-download.jpg) no-repeat 0 0;}
#btn-dl-movie {background: url(/connect/images/goc/btn-movie.jpg) no-repeat 0 0;}
#btn-dl-news {background: url(/connect/images/goc/btn-news.jpg) no-repeat 0 0;}

#btn-pnd-movie:link, #btn-dl-movie:link, #btn-pnd-news:link, #btn-dl-news:link {color:#808080;}
#btn-pnd-movie:visited, #btn-dl-movie:visited, #btn-pnd-news:visited, #btn-dl-news:visited {color:#808080;}

#btn-pnd-movie:hover, #btn-dl-movie:hover {background: url(/connect/images/goc/btn-movie_news-download.jpg) no-repeat 0 -51px;}
#btn-pnd-news:hover {background: url(/connect/images/goc/btn-movie_news-download.jpg) no-repeat 0 -51px;}
#btn-dl-movie:hover {background: url(/connect/images/goc/btn-movie.jpg) no-repeat 0  -51px;}
#btn-dl-news:hover {background: url(/connect/images/goc/btn-news.jpg) no-repeat 0  -51px;}

#btn-pnd-movie, #btn-pnd-news, #btn-dl-movie, #btn-dl-news {display: block;width:220px;height: 51px;text-decoration: none}
#btn-pnd-movie span, #btn-pnd-news span{display: block;padding:12px 0 0 66px;font-weight:bold}
#btn-dl-movie span, #btn-dl-news span{display: block;padding:3px 0 0 66px;font-weight:bold}
/* btn news */
.btn-news-cultural {background: url(/connect/images/goc/cht_dll_bitmap_230.gif) no-repeat top center;}
.btn-news-garmin {background: url(/connect/images/goc/cht_dll_bitmap_221.gif) no-repeat top center;}
.btn-news-ttn {background: url(/connect/images/goc/cht_dll_bitmap_223.gif) no-repeat top center;}

.btn-news-cultural,.btn-news-garmin,.btn-news-ttn{width:42px;height:42px;display: block;text-align:center;margin:0 auto;text-decoration: none;}
/*
.btn-news-cultural span,.btn-news-garmin span,.btn-news-ttn span{font:bold 12px arial;display: block;padding-top:42px;}
.btn-news-cultural:visited, .btn-news-garmin:visited, .btn-news-ttn:visited {color:#808080}
.btn-news-cultural:hover, .btn-news-garmin:hover, .btn-news-ttn:hover {color:#FF0000}
*/

form#frmnews ul {list-style: none;padding: 0;margin: 0;}
#frmnews ul li {float:left;width:100px;height:60px;display: block;margin:5px;text-align:center;border:0px solid #33FF00}
#frmnews label {padding-left: 20px;background: url(/connect/images/goc/cht_dll_bitmap_251-s.gif) no-repeat 80px 2px;cursor: pointer;color: #777;border:0px solid #FF0000; font:bold 12px arial;display: block;}
#frmnews label.checked {color:#023AFD;background: url(/connect/images/goc/cht_dll_bitmap_251.gif) no-repeat 80px 2px;}
#frmnews label.over {color: #004080;}
/*
Cultural and Artistic Activities
Shows and Exhibition
*/

/* #container-1 {height:400px;} */
#container-1 {height:100%;}
/* #movies {background:url(/connect/images/goc/cht_dll_bitmap_263.jpg) no-repeat right bottom;}*/
#movies {background: #fff /* url(/connect/images/goc/cht_dll_bitmap_232.jpg) no-repeat right bottom; */}
#news{background: #fff /* url(/connect/images/goc/cht_dll_bitmap_234.jpg) no-repeat right bottom;*/ }

#movies,#news,#intro {height:100%;border:1px solid #004080;overflow:auto;/*min-height:390px;*/}
#movies img,#news img,#intro img{vertical-align: middle;}

/* 4 pdmaker */
div.markerTooltip img.loading{ margin-top:2px; margin-right: 4px; }
img#progress{ opacity: 1; -moz-opacity: 1; -khtml-opacity: 1; filter: alpha(opacity=100); }

div.markerTooltip, div.markerDetail {font-size: 11px;}
.markerDetail img {border:0;}
.markerTooltip,.markerDetail{color:#000;font-weight:bold;background:#fff;white-space:nowrap;margin:0;padding:2px 4px;border:1px solid #000;}
.markerTooltipAlternate{color:#fff;font-weight:bold;background:#666;white-space:nowrap;margin:0;padding:2px 4px;border:1px solid #000;}
.markerTooltip a,.markerDetail a,.markerTooltipAlternate a{text-decoration:underline; color:blue;}

/* search box */
#srchbox {margin: 5px 0;background:#99B3CC;margin:0 0 0 0;font:normal 11px arial;text-align:center;width:80%;border-bottom:1px solid #5078A0;height:26px;}
#srchbox form {margin: 0; /* for IE, Opera, ... */}
#srchbox .equal { vertical-align: middle; /* for IE */}
#srchbox .btn-submit {width:100px;height:18px; cursor:pointer;border:outset 1px #ccc;background:#999;color:#666;font-weight:normal;padding:1px;background:url(/connect/images/goc/formbg.gif) repeat-x left top;}
#srchbox .fld-input {width:50%; height:16px;background:#fff url(/connect/images/goc/search.gif) no-repeat 1px 1px; padding-left:18px;font:normal 13px arial}

/* 4 connect template , 2008/06/18 by Vincent --------------------------------*/
body{font: 100% arial,sans-serif; background:#fff url(/connect/images/connect/bg_main.jpg) repeat-x;}
body, html {overflow:hidden;width:100%;height:100%;position:absolute;min-width:960px;}

/* header */
div#header {height:180px;margin:0 0 2px 0; margin-left:10px; padding-left:0px; background:transparent;}
div#header #menu {clear:both;}
div#header #menu div#logo {float:left; display:block;margin-bottom:10px;}
div#header #menu ul#sub-menu {list-style: none;margin-top:40px;float:left;}
div#header #menu ul#sub-menu li{margin-right:1px; float:left; position: relative; left:-30px;}
div#header #login {float:right;padding:30px 10px 0 0;color:#fff;font:normal 10pt Arial, Helvetica, sans-serif;}
div#header #main-photo {text-align:center;width:100%;}
div#header #help {background:url(/connect/images/connect/icon_help.gif) no-repeat 0 0; padding-left:18px;}
div#header #menu img {border:0}

div#header h1.news {float:left; margin:0; background:url(/connect/images/connect/title_news.jpg) no-repeat; padding-left:48px; width:250px; height:75px; margin-right:10px;}
div#header h1.movies {float:left; margin:0; background:url(/connect/images/connect/title_movies.jpg) no-repeat; padding-left:48px; width:250px; height:75px; margin-right:10px;}

div#header-main {width:500px; border:0px solid #66CC00;float:left}

div#header #tips {background:#fff; padding:5px; color:#626262;width:500px;margin:0 auto;text-align:center;font-size:75%; font-family:arial, 新細明體,PMingLiU,細明體,MingLiU}
div#header hr {border: none 0; border-top: 1px dashed #C0C0C0;width: 100%;height: 1px;}

a.white ,a.white:visited {color: #fff;text-decoration: none;}
a.white:hover ,a.white:active {color: #FFFF00;}

.f9 {font:normal 9pt Arial, Helvetica, sans-serif; color:#c0c0c0}
.f10 {font:normal 10pt Arial, Helvetica, sans-serif;}
.txt-white {color:#fff}
.pd10 {padding:10px;}

#intro p {margin:0; width:100%;text-align:center}

/* search box */
#srchbox {margin: 15px 0 0 0; background:#EBEBEB; /* #f3f3f3 */font:normal small arial;text-align:center;width:500px;border-bottom:1px solid #C0C0C0;float:left;height:40px;}
#srchbox form {margin: 0; /* for IE, Opera, ... */; padding:10px 5px;}
#srchbox .equal { vertical-align: middle; /* for IE */}
#srchbox .fld-input {width:200px; height:16px;background:#fff url(/connect/images/goc/search.gif) no-repeat 1px 1px; padding-left:18px;font:normal 13px arial}

div#gg-map {width: 100%; height: 100%;margin:0; padding:0;}

div#footer p{text-align:center}
div#footer p a{color:#fff}
div#footer p a:hover{color:#C0C0C0;text-decoration: none;}

/* corner */
.spiffy{display:block}
.spiffy *{display:block; height:1px; overflow:hidden; font-size:.01em; background:#99B3CC}
.spiffy1{margin-left:3px; margin-right:3px; padding-left:1px; padding-right:1px; border-left:1px solid #d3dee9; border-right:1px solid #d3dee9; background:#b2c6d8}
.spiffy2{margin-left:1px; margin-right:1px; padding-right:1px; padding-left:1px; border-left:1px solid #f4f7f9; border-right:1px solid #f4f7f9; background:#acc1d5}
.spiffy3{margin-left:1px; margin-right:1px; border-left:1px solid #acc1d5; border-right:1px solid #acc1d5;}
.spiffy4{border-left:1px solid #d3dee9; border-right:1px solid #d3dee9}
.spiffy5{border-left:1px solid #b2c6d8; border-right:1px solid #b2c6d8}
.spiffyfg{background:#99B3CC}