html,body{margin:0;padding:0}
body{font: 100% arial,sans-serif;background:#fff url(/connect/images/bg_main.jpg) repeat-x;}
body, html {/*overflow:hidden;width:100%;height:100%;position:absolute;*/}

/* header */
div#header {height:auto;margin: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/icon_help.gif) no-repeat 0 0; padding-left:18px;}
div#header #menu img {border:0}

div#container h1 {float:left; margin:0; background:url(/connect/images/title_richpoi.jpg) no-repeat; padding-left:0px; width:280px; height:75px;}
div#header hr {border: none 0; border-top: 1px dashed #C0C0C0;width: 100%;height: 1px;}

div#footer{background:#333; color:#D2D2D2;text-align:center;height:26px;}
div#footer p{margin:0;padding:5px 10px}
div#footer p a{color:#fff}
div#footer p a:hover{color:#C0C0C0;text-decoration: none;}

div#footer{clear:both;width:100%; color:#fff;font: 80% arial,sans-serif;}

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

div#gg-map {width:100%; margin:0; height:600px;color:#C0C0C0}

#container-1 {height:100%;}
#container-1 p{margin:5px 0 0 0;}
#mypoi, #hotpoi, #searchpoi, #intro {height:100%; border:1px solid #004080;overflow:hidden;background:#fff; padding:0 0  0;}

div#searchpoi div.content {background:#fff url(/connect/images/loading-s.gif) no-repeat center;}
div#searchpoi div.content div.info {height:90%;background:#fff;padding:10px}

img {border:0}
form{margin:0}
br.clear {clear:both;}
.pd10 {padding:10px;}
.aln-center {display:block;margin:0 auto}

.txt-blue {color:#184E84}
.txt-white {color:#fff}
.txt-gray {color:#C0C0C0}

#help {background:url(/connect/images/icon_help.gif) no-repeat 0 0; padding-left:18px;}
/* tag -----------------------------------------------------------------------*/
.f9 {font-size: 9pt}
.f10 {font-size: 10pt}
.f11 {font-size: 11pt}
.f12 {font-size: 12pt}
.f13 {font-size: 13pt}
.f14 {font-size: 14pt}
.f15 {font-size: 15pt}
.f16 {font-size: 16pt}

.f9,.f10,.f11,.f12,.f13,.f14,.f15,.f16 {font-weight:normal; font-family: arial, 新細明體,PMingLiU,細明體,MingLiU}

.c1 {color: #D96A6A;}
.c2 {color: #0050AA;}
.c3 {color: #A000AA;}
.c4 {color: #069747;}
.c5 {color: #3C771E;}
.c6 {color: #823F04;}
.c7 {color: #1379CF;}
.c8 {color: #B60D0D;}
.c9 {color: #FF7800;}

a.c1,  a.c1:active, a.c1:visited {color:#D96A6A;}
a.c2, a.c2:hover, a.c2:active, a.c2:visited {color:#0050AA;}
a.c3, a.c3:hover, a.c3:active, a.c3:visited {color:#A000AA;}
a.c4, a.c1:hover, a.c4:active, a.c4:visited {color:#069747;}
a.c5, a.c1:hover, a.c5:active, a.c5:visited {color:#3C771E;}
a.c6, a.c1:hover, a.c6:active, a.c6:visited {color:#823F04;}
a.c7, a.c1:hover, a.c7:active, a.c7:visited {color:#1379CF;}
a.c8, a.c1:hover, a.c8:active, a.c8:visited {color:#B60D0D;}
a.c9, a.c1:hover, a.c9:active, a.c9:visited {color:#FF7800;}

a.c1:hover, a.c2:hover,a.c3:hover,a.c4:hover,a.c5:hover,a.c6:hover,a.c7:hover,a.c8:hover,a.c9:hover{text-decoration: none;}

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

a.blue ,a.blue:visited {color: #0686CF;text-decoration: none;}
a.blue:hover ,a.blue:active {color: #053799;}

a.blue_heavy ,a.blue_heavy:visited {color: #164E83;text-decoration: none;}
a.blue_heavy:hover ,a.blue_heavy:active {color: #1F71BA;}

a.red ,a.red:visited {color: #f00;text-decoration: none;}
a.red:hover ,a.red:active {color: #053799;}

a.black ,a.black:visited {color: #000000;text-decoration: none;}
a.black:hover ,a.black:active {color: #808080;}

a.lnk-fn {color:#FF9900;text-decoration:none}
a.lnk-fn:hover {color:#CC7A00;text-decoration:underline}

a.lnk-tag {color:#808080;text-decoration:none;background:#fff url(/connect/images/arrow_093.gif) no-repeat left 0;padding-left:12px;}
a.lnk-tag:hover {color:#3366CC;text-decoration:underline;}

/* pagenavi -----------------------------------------------------------------*/
div.yahoo{padding:10px 3px;margin:3px;text-align:center;border-top:1px solid #F5F5F5}
div.yahoo a{padding:2px;margin:2px;border:1px solid #fff;text-decoration:underline;color:#808080;}
div.yahoo a:hover{border:1px solid #000099;color:#000;}
div.yahoo a:active{border:1px solid #000099;color:#f00;}
div.yahoo span.current{padding:2px;margin:2px;border:1px solid #fff;font-weight:bold;background-color:#fff;color:#000;}
div.yahoo span.disabled{padding:2px;margin:2px;border:1px solid #EEE;color:#DDD;}

/* POI ------------------------------------------------------------------------*/
#poi-content {width:100%;height:150px;overflow:auto}
#poi {width:420px;color:#9B9B9B;font-size:small;border:0px solid #3366CC}
#poi-title {color:#000;font-size:medium;font-weight:bold;background:#EBEBEB;padding:2px 0} 

#poi td {border:0px solid #0099CC}
#poi tr hr {border: none 0; border-top: 1px dashed #C0C0C0;width: 100%;height: 1px;}

#poi ul,#poi ul li {margin:0;padding:0}
#poi ul.list {list-style-image:url(/connect/images/icon_blue.gif);padding-left:20px;margin:0 0 5px;}

#poi-big-td {text-align:center}
#poi-desc-td {width:210px;}
#poi-show-big-img {width:215px;height:165px;background:url(/connect/images/loading-s.gif) no-repeat center; }
#poi-show-thumb img {width:80px;height:80px;margin:0 15px 5px 0;border:1px solid #808080; background:url(/connect/images/loading-s.gif) no-repeat center;}
#poi .article-date {float:right;padding:5px}

/* search result -------------------------------------------------------------*/
.r-title {color:#0F0F0F; font-size:11pt}
a span.r-key {color:#FF9900}
.r-body {color:#9A9A9A}
.i-bg {background:#fff}

.selected {background:#EBEBEB}
.highlight{background:#E8F9FF}

#Searchresult {font-size:small;padding:5px 10px;}

div#garmintable {width:auto;background:#fff}
div#garmintable #srch-result {font-size:85%;width:260px}
div#garmintable #srch-result tr {cursor:pointer;}
div#garmintable #srch-result tr a{text-decoration:none;}
div#garmintable td {/*border-bottom:1px dotted #E1E1E1*/padding-bottom:.2em}

div#mypoitable {width:auto;background:#fff}
div#mypoitable #srch-result {font:normal 9pt arial, 新細明體,PMingLiU,細明體,MingLiU;width:260px}
div#mypoitable #srch-result tr a{text-decoration:none;}
div#mypoitable td {/*border-bottom:1px dotted #E1E1E1*/padding-bottom:.2em}
div#mypoitable a {color:#3366CC;font-size:11pt; background:transparent url(/connect/images/arrow_061.gif) no-repeat left 3px; padding-left:12px;}
div#mypoitable a:hover {color:#004080}

div#mypoitable span.del,div#mypoitable span.edit {cursor:pointer;color:#808080}

/* icon - number */
.icon1 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 0; width:25px;height:41px;}
.icon2 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -41px; width:25px;height:41px;}
.icon3 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -82px; width:25px;height:41px;}
.icon4 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -123px; width:25px;height:41px;}
.icon5 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -164px; width:25px;height:41px;}
.icon6 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -205px; width:25px;height:41px;}
.icon7 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -246px; width:25px;height:41px;}
.icon8 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -287px; width:25px;height:41px;}
.icon9 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -328px; width:25px;height:41px;}
.icon10 {background:transparent url(/connect/images/single/icon_number.png) no-repeat 0 -369px; width:25px;height:41px;}

/* btn login + add */
div#notlogin {text-align:center; margin:20px;display:none}

a.btn-login {background:transparent url(../i/button_sign_in_bg.png) no-repeat 0 0; width:100px;height:20px; padding-top:5px; text-align:center;display:block;text-decoration:none;color:#000; margin:0 auto;}
a.btn-login:hover {background:transparent url(../i/button_sign_in_bg.png) no-repeat 0 -30px; width:100px;height:20px; padding-top:5px; text-align:center;display:block;text-decoration:none}
a.btn-login:active {background:transparent url(../i/button_sign_in_bg.png) no-repeat 0 -60px; width:100px;height:20px; padding-top:5px; text-align:center;display:block;text-decoration:none}

a.btn-add {background:transparent url(../i/button_add.png) no-repeat 0 0; width:35px;height:21px; display:block;}
a.btn-add:hover {background:transparent url(../i/button_add.png) no-repeat 0 -30px; width:35px;height:21px;display:block;}
a.btn-add:active {background:transparent url(../i/button_add.png) no-repeat 0 -60px; width:35px;height:21px;display:block;}

a.btn-detail {background:transparent url(../i/button_search.png) no-repeat 0 0; width:37px;height:21px; display:block;float:left}
a.btn-detail:hover {background:transparent url(../i/button_search.png) no-repeat 0 -30px; width:37px;height:21px;display:block;}
a.btn-detail:active {background:transparent url(../i/button_search.png) no-repeat 0 -60px; width:37px;height:21px;display:block;}
/* search tabs -----------------------------------------------*/
#goSearch1, #goSearch2 {background:url(../i/btn_go.jpg) no-repeat;width:45px;height:22px;border:0;cursor:pointer;}

div.tabs {font-size:9pt; color: #959595; width:auto; float:left; height:85px;}

.tabNavigation a{color:#606060; text-decoration:none;  width:92px; height:23px;display:block;text-align:center; padding:5px 0 4px;margin-left:10px; float:left; position: relative;}

.tabNavigation a.first {margin-left:20px;}
.tabNavigation a.selected {background:transparent url(../i/tab_item_bg.jpg) no-repeat 0 2px;}
.tabNavigation a:focus{outline:0;}

div#first, div#second {background:url(../i/tab_h.jpg) no-repeat;width:648px;padding:10px 0 0px 20px;margin-top:-10px;}
div#second { display:none}
input.key {width:300px; border-top:2px solid #646464;border-left:2px solid #646464;border-bottom:1px solid #C0C0C0;border-right:1px solid #C0C0C0;}
input.key2 {width:180px; border-top:2px solid #646464;border-left:2px solid #646464;border-bottom:1px solid #C0C0C0;border-right:1px solid #C0C0C0;}

/* 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}

/* hot accordion */
ul#accordion{list-style:none; margin:5px 0 0; padding:0;}
ul#accordion li{float:left; padding:0px; display:block; margin-right:5px; overflow:hidden; height:16px; width:30px;}
ul#accordion li#a1{width:500px;}
ul#accordion li img{position:absolute; border:3px solid #881212;}
ul#accordion li span{background:#BEBEBE url(../i/arrow_141.gif) no-repeat right 47%;padding:2px 3px 2px 1px;margin-right:2px; cursor:pointer; color:#fff}