/****************

Cascading Style Sheet by Bluefrog 
http://bluefrog-creative.com
bluefrog.creative@gmail.com

***************/


/*--- reset css ----*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
body {line-height:1;}
ol, ul {list-style:none;}

/*-- sticky footer --*/
/*html, body, #wrap {height:100%;}
body > #wrap {height:auto; min-height:100%;}
#main {padding-bottom:49px;}  /* must be same height as the footer // tinggi sebenar footer 79px // tolak padding 30px atas bawah */
/*#footer {margin-top:-49px; /* negative value of footer height */ /*height:49px; clear:both;} 

.clearfix:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
/* html .clearfix { height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/*-- end of sticky footer --*/

* {margin:0;}
html, body {height:100%;}
#wrap {min-height:100%; height:auto !important;	height:100%; margin:0 auto -49px; position:relative;}
#footer {height:39px;} /*kalau ada padding, tolak.*/
.clearfix {height:49px; clear:both;}


/*--- real weh.. penat ooooo.. ---*/
body {font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; color:#404041; text-align:center; margin:0 auto;}
p {line-height:1.2em; margin:15px auto;}
#container {width:769px; /*height:452px;*/ margin:0 auto;}

/* -- top navigation -- */
#top-nav {height:32px; width:auto; background-color:#041a3c;}
#top-nav-content {text-align:right; line-height:2em; font-size:12px; font-weight:bold; margin:0 auto; width:769px; padding-right:40px;}
.top-text1 {color:#7c7c7c;}
.top-text2 {color:white;}

#logo {background:url(images/img-logo.gif) no-repeat; width:317px; height:65px; float:left;}
#tagline {float:left; font-family:Arial, Helvetica, sans-serif; font-size:11pt; padding:15px 0; text-align:justify;}

.clearbox {clear:both; line-height:0; height:0;}

#menu-top {clear:both; padding:5px 5px 8px 0;}
#menu-top ul {margin:0; padding:0; list-style:none;}
#menu-top ul li {float:right; background:url(images/img-menu.gif) no-repeat; width:118px; height:23px; text-align:center; padding-top:5px; margin-left:7px; line-height:1.15em;}
#menu-top ul li a {color:white; text-decoration:none; font-weight:bold;}
#menu-top ul li a:hover {text-decoration:underline;}

#banner-main {width:769px; height:147px; background:url(images/img-banner.gif) no-repeat; text-align:center; padding-top:9px;}

#content-wrapper {width:769px; margin-top:10px; display:block;}
#content-left {width:178px; float:left; margin-right:5px;}
#content-right {width:178px; float:right; /*margin-left:5px;*/ border-left:1px black dashed; padding-left:7px;}
#title-news, #title-ads, #title-main {width:178px; height:22px; text-align:center; padding-top:6px; font-weight:bold; line-height:1.15em;}
#title-news, #title-ads {background:url(images/img-title.gif) no-repeat;}
#title-main {background:url(images/img-title-main.gif) no-repeat;}
#title-ads {float:right;}

/*-- text shadow --*/
.news-txt2, .ads-txt2, .about-txt2, .faq-txt2, .contact-txt2 {color:#fff;}
.news-txt2 {margin-left:-85px;}
.ads-txt2 {margin-left:-76px;}
.about-txt2 {margin-left:-59px;}
.faq-txt2 {margin-left:-35px;}
.contact-txt2 {margin-left:-70px;}

#news-space, #ads-space {padding-top:7px; clear:both; /* width:178px - 14px // width:164px */}
#ads-space img {margin-bottom:10px;}

#slide-content {width:384px; height:233px; float:left; padding:0 7px; background:url(images/img-sliding-content.gif) no-repeat center center;}

#box1 div ul li {float:left; width:75px; height:143px;}
#box1 div ul a {cursor:pointer;}
.bus {background:url(images/img-slide-bus.gif) no-repeat;}
.taxi {background:url(images/img-slide-teksi.gif) no-repeat;}
.train {background:url(images/img-slide-train.gif) no-repeat;}
.fly {background:url(images/img-slide-fly.gif) no-repeat;}
/*- button hover -*/
.bus:hover {background:url(images/img-slide-bus-over.gif) no-repeat;}
.taxi:hover {background:url(images/img-slide-teksi-over.gif) no-repeat;}
.train:hover{background:url(images/img-slide-train-over.gif) no-repeat;}
.fly:hover {background:url(images/img-slide-fly-over.gif) no-repeat;}
.bus, .taxi, .train, .fly {margin:20px auto auto 12px;}

/*-- main content --*/
#main-content {width:584px; float:left; border-left:1px black dashed;}
/*#home {display:block;}*/
#swap1, #swap2, #swap3 {display:none; padding:0 8px; text-align:left;}
#swap1 p, #swap2 p, #swap3 p {text-align:justify;}

/* transport */
#bus-table, #taxi, #train, #fly, #even, #hosp, #tour {width:580px; margin:0 auto; text-align:left;}
#bus-table tr td {line-height:1.5em; border-bottom:1px black solid; padding-bottom:5px;}
#bus-table tr td.col1 {width:20px;}
#bus-table tr td.col2 {width:260px;}
#bus-table tr td.col3 {width:200px;}
#bus-table tr:nth-child(odd) {background:#CCFF99;}/* not working in IE--- sucks*/

#taxi ol, #train ol, #fly ol, #even ol, #hosp ol, #tour ol {list-style:decimal; margin:0; padding-left:10px; line-height:1.7em;}
#taxi ol li, #train ol li, #fly ol li, #even ol li, #hosp ol li, #tour ol li {margin-left:20px;}
#taxi ol li a, #train ol li a, #fly ol li a, #even ol li a, #hosp ol li a, #tour ol li a {text-decoration:none; color:#2c2824; padding-right:35px;}
#taxi ol li a:hover, #train ol li a:hover, #fly ol li a:hover, #even ol li a:hover, #hosp ol li a:hover, #tour ol li a:hover {text-decoration:underline;}
#taxi ol li.online a, #train ol li.online a, #fly ol li.online a, #even ol li.online a, #hosp ol li.online a, #tour ol li.online a {background:url(images/img-online.gif) no-repeat right center;}
#taxi ol li.offline a, #train ol li.offline a, #fly ol li.offline a, #even ol li.offline a, #hosp ol li.offline a, #tour ol li.offline a  {background:url(images/img-offline.gif) no-repeat right center;}
#taxi ol li.offline a:hover, #train ol li.offline a:hover,  #fly ol li.offline a:hover, #even ol li.offline a:hover, #hosp ol li.offline a:hover, #tour ol li.offline a:hover  {text-decoration:none; cursor:default;}


marquee {height:188px; border:1px #0d1c47 dotted; padding:4px;}


#add {width:220px; float:right; line-height:1.52em; margin:0;}

/* form */
.form input {width:300px; height:21px; font-family:"Century Gothic"; font-size:11px; color:#000000; padding:2px 0 0 6px; border-color:#D5D5D5; border-style:solid; border-width:1px; background-color:#E4E4E7; margin-bottom:5px;}
.form textarea {width:300px; height:98px; font-family:"Century Gothic"; font-size:11px; color:#000000; overflow:auto; padding:2px 0 0 6px; border-color:#D5D5D5; border-style:solid;	border-width:1px; background-color:#E4E4E7; margin-bottom:5px;}
.form input:hover, .form textarea:hover, .form input:active, .form textarea:active {background-color:#FFFF99;}
.form strong a, .form strong {color:#404041; text-decoration:none;}
.form strong a:hover {color:#F6B83F; text-decoration:underline;}
/***----------------------------***/


#footer {background-color:#0d1c47; text-align:center; color:white; padding-top:10px;}
#footer a {text-transform:uppercase; color:white; text-decoration:none; }
#footer a:hover {text-decoration:underline;}
.copyright {color:#727272; line-height:2em;}

/* noob slide */
p.buttons {margin:0; font-size:12px; text-align:center; }
.buttons span{cursor:pointer; margin:0 7px; padding:3px;}
.buttons span.active, .buttons span:hover{color:#afafaf; border-bottom:1px dotted #F6B83F; padding:3px;}
.buttons {color:#F6B83F;}

#box-main {color:white; height:213px; width:auto; padding:10px;}
#box1 {position:absolute;}
#box1 div {line-height:1.15em; width:361px; float:left;} 
#box1 a {color:#F6B83F;}
#box1 a:hover {text-decoration:underline;}
#box1 .buttons {text-align:left}
#box1 div p a:hover.deadlinks {cursor:default; text-decoration:none;}
#box1 div p {margin:0;}
.mask {position:relative; width:361px; height:178px; overflow:hidden;}/* tinggi untuk view utama */
#handles {margin-bottom:20px; }


