/* ---------- HTML ELEMENTS ---------- */
body {background: #ffffff url('../images/bg.jpg') repeat scroll center 0; font:0.7em tahoma, arial, sans-serif; 
color:#3A6485;font-weight:normal;} 
a {color:#3A6485;cursor:pointer;outline-style:none;text-decoration:none;}
 
ul {list-style-type:none;margin:0;padding:0;}
h2{font:2.0em "Times New Roman", Times, serif;color:#006699;margin-bottom:10px;}
h3{font:1.8em  "Times New Roman", Times, serif;color:#006699;margin-bottom:10px;}
h4{font:1.3em  Arial, Times, serif;color:#006699;margin-bottom:1px;color:#616161}
h5{font:1.2em  Arial, Times, serif;color:#006699;margin-bottom:1px;}

div .hr {height:1px; width:239px; padding:0; margin:10px 0px 10px 28px;  background: #fff url('../images/line.gif')  repeat-x scroll center;}

form table, form tr,form td {vertical-align: top; } 
form input, form textarea, form select {width:auto;height:25px;margin:5px 0 5px 0px;  border-color: #C0C0C0;border-width: 1px;border-style: 
solid;}
form select {height:25px;padding:4px;}
form input { margin-left:0px; }
textarea { height: 300px; overflow: auto;} 
 
/* ---------- MAIN LAYOUT ---------- */
#container {margin:0px auto 0px auto; width:980px;}
#logo{margin:10px auto 0px auto; width:980px; height:140px;}
#add-menu {margin:5px auto 0px auto; width:980px;height:20px;}
#add-menu p {float:right;padding-right:5px;font:1.2em  "Times New Roman", Times, serif; }
#menu {background: #1b3345;width: 980px;height:30px;}  
#main-image {background:#fff url('../images/main-bg.jpg') repeat scroll 0 0;  float:left;  width:980px; height:300px; padding:0;margin:0;}
#content{width:978px;border:1px solid #bfcad2; border-top:none; background:#fff;}
#content-left { width:680px; padding:0; margin:0; float:left;}
#content-right {width:296px;float:right;}
#container-right {border-left:1px solid #E6E6E6;}
 
#footer {width:980px;height:65px;background:#1b3345;color:#C7D9EF;text-align:center;padding-top:4px;}
.clear {clear:both;}
#blank-spacer {clear:both;height:100px;}
/* ---------- CONTENT ---------- */
#active {background-color: #3987A4;}
#content-date{font-size:0.8em;}
#logo-ykaki { padding:0;margin-left:10px;float:left;}
#logo-icccpo {padding:0;margin:20px 20px 0px 0px;float:right;}

/* ---------- main-banner ---------- */
#banner-main {width:978px; height:105px; float:left; margin:0; padding:0;}
#banner-middle {padding:5px 0px 0px 7px;}
#banner-middle ul li {list-style: none; float:left;} 
#banner-middle ul li {padding:0px 5px 0px 0px;}
/* ---------- main-right ---------- */
#banner-main-aksi{display:block; margin:0px 0px 20px 28px;width:239px; height:234px; padding:0 }
#horz-line {height:1px; width:239px; padding:0; margin:10px 0px 10px 28px; border-top:1px dotted #cdcdcd}
 
#banner-social {width:296px; height:100px; margin:10px 0px 10px 0px;}
#banner-social p {text-align:center}
#icon-social {height:60px; padding:15px 0px 0px 55px;}
#icon-social ul li {height:70px; width:32px; list-style: none; margin-right:20px;float:left;} 

#banner {margin:20px 20px 0px 20px ;}
#banner ul {list-style-type: none; padding: 0px; margin: 0px;} 
#banner li {padding:10px 0px 10px 10px;border-bottom:1px dotted #cdcdcd;}
  
/* ---------- main-left ---------- */
#content-container {width:600px;  margin:0px 0px 40px 0px; padding:0px 0px 0px 45px; line-height:16px;}
#content-container ul {list-style-type: none; padding: 0px; margin: 0px; } 
#content-container li {background-image: url('../images/dot-title4.gif'); background-repeat: no-repeat; background-position: 0px 7px; 
padding:2px 0px 2px 15px;  }


/* ---------- panel ---------- */
#panel-main {width:610px; margin:0; padding:0px 0px 0px 40px;}
#panel-title {font:1.8em "Times New Roman", Times, serif;color:#fff;padding:13px 0px 0px 10px;}
#panel-left {width:286px; height:255px;float:left; margin:0px 28px 0px 0px;background:#eaf4ff;}
#panel-right {width:286px; height:255px;float:right;margin:0;background:#FFFCD9;}
 
#title-left-container, #title-right-container {color: #ffffff; width:270px; height:49px; margin:8px;}
#title-left-container {background-color:#2691d7;}
#title-right-container {background-color:#f1702c;}

#panel-image {float:left;padding:5px;} 
#news-list {margin:20px 20px 0px 20px ;} 
#news-list ul {list-style-type: none; padding: 0px; margin: 0px;} 
#news-list li {background: url('../images/dot-title.gif') no-repeat; background-position: 0px 9px; padding:4px 0px 20px 15px;} 
#main-news-list, #main-activity-list {margin:35px 20px 0px 20px ;} 
#main-news-list ul {width:240px;list-style-type: none; padding: 0px; margin: 0px;}
#main-news-list li {background: url('../images/dot-title.gif') no-repeat; background-position: 0px 8px; padding:4px 0px 4px 15px; 
border-bottom:1px dotted #cdcdcd;}
#main-activity-list ul {width:240px;list-style-type: none; padding: 0px; margin: 0px;}
#main-activity-list li {background: url('../images/dot-title2.gif') no-repeat;background-position: 0px 8px; padding:4px 0px 4px 15px; 
border-bottom:1px dotted #cdcdcd;}
#index {float:right;margin:0px; margin-right: 10px; padding:0px; width:40px;}
#content-img {border:3px solid #ffffff; float:left; margin:0px 10px 10px 0px;}
 
/* ---------- pages ---------- */
#breadcrumb {width:600px; margin:0px 0px 10px 0px; padding:0px 0px 0px 45px;font:1.0em tahoma,"Times New Roman", Times, serif;}
#page-title {font:2.8em "Times New Roman", Times, serif; padding:53px 0px 0px 40px; ;color:#fff;}
#content-title { border-top:1px solid #D7E0FB; border-bottom:1px solid #D7E0FB; font:1.9em "Times New Roman", Times, serif; padding:7px 0px 
7px 0px;  margin-bottom:20px;}
#blank-15 {clear:both;height:15px;}
#blank-30 {clear:both;height:30px;}
#blank-50 {clear:both;height:50px;}
#blank-80 {clear:both;height:80px;}
#page-banner {height:153px; width:980px;background:url('../images/bg-page.jpg');} 
#page-banner-program {height:153px; width:980px;background:url('../images/bg-page-activities.jpg');} 
#page-banner-news {height:153px; width:980px;background:url('../images/bg-page-news.jpg');} 
#page-banner-cancer {height:153px; width:980px;background:url('../images/bg-page-cancer.jpg');} 
#page-banner-donation {height:153px; width:980px;background:url('../images/bg-page-donation.jpg');} 
#page-banner-link {height:153px; width:980px;background:url('../images/bg-page-links.jpg');} 
#page-banner-map {height:153px; width:980px;background:url('../images/bg-page-map.jpg');} 
#page-banner-contact {height:153px; width:980px;background:url('../images/bg-page-contact.jpg');} 
#banner-page ul, menu-page ul {margin:0px 0px 0px 28px ;}
#banner-page li {margin-bottom:10px;}
#menu-page {padding-bottom:25px;}
#menu-page li {font:1.1em "Times New Roman", Times, serif; background: url('../images/arrow-right-title.png') no-repeat 0 .5em ;margin:0px 
0px 0px 28px; border-bottom: 1px dotted #3987A4; width:210px;padding:8px 0px 6px 25px;}


/* ---------- slideshow ---------- */
#slideshow {height:200px;padding:0;margin:0px 20px 0px 30px;}
#slideshow img {position:absolute; padding: 0px; margin:50px 20px 20px 5px;z-index:8;opacity:0.0;}
#slideshow img.active {z-index:10;opacity:1.0;}
#slideshow img.last-active {z-index:9;}
#download li {background:url('../images/download.png');background-repeat: no-repeat; background-position:0px 8px;  height:43px; width:350px; 
background-color:#B6EA9F; } 

/* ---------- press ---------- */
#press-list ul {margin:0; padding:0;}
#press-list li {margin-bottom:20px;}
#media-list ul {margin:0; padding:0;}
#media-list li {margin-bottom:10px;} 
#banner-content-small {padding:0;margin-bottom:15px;}
#rounded-content-small {float:left;margin-right:5px;width:194px;height:116px;}

/* ---------- map ---------- */
#map {width: 450px;height:450px;float: left; margin-right:7px; border:3px solid #cdc;}
#map-side-bar { padding:0; margin-left: 10px} 
#site-map {margin:15px 20px 0px 20px;}
#site-map ul {list-style-type: none; padding: 0px; margin-bottom: 10px;}
#site-map li {background: url('../images/dot-title4.gif') no-repeat; background-position: 0px 10px; padding:4px 0px 4px 20px;} 
#site-map-children {margin:40px;} 
#site-map-children li {background: url('../images/dot-title.gif') no-repeat;background-position: 0px 10px; padding:4px 0px 4px 15px;}

#text-area, #faddress {width:300px; height:70px; border:1px solid #cdc}
#fquestion, #fmessage {width:300px; height:70px; border:1px solid #cdc}
.submit { width:100px; height:35px; font-weight:bold} 
#message {width:550px;   border:1px solid #CEE9FF; padding:20px; background-color:#F9FCFF;overflow:visible !important;}
#err_message{ width:510px; padding:13px 10px 0px 10px; background-color:#FFEA93; color:#f00;font:1.2em arial, Times, serif; } 

#in-memoriam {border-collapse:collapse; width:100%}
#in-memoriam td, #in-memoriam th {font-size:1em;border:1px solid #A0CCEF;padding:3px 7px 2px 7px;}
#in-memoriam th {font-size:1.1em;text-align:left;padding-top:5px;padding-bottom:4px; color:#ffffff;}
#in-memoriam tr.alt td {}

#table-default {border-collapse:collapse; width:80%}
#table-default td, #table-default th {font-size:1em;border:1px solid #A0CCEF; padding:3px 7px 2px 7px;}
#table-default th {font-size:1.1em;text-align:left;padding-top:5px;padding-bottom:4px; color:#cdcd}

#question {width:560px; margin:0;background:#F0F7FF;padding:20px; color:#676767}
#question-list { padding: 0px; }
#question-list ul { padding: 0px; margin: 0px; width:550px;} 
#question-list ul li{background: url('../images/dot-title4.gif') no-repeat; border-bottom:1px dotted #cdc; background-position: 0px 25px; padding:20px 0px 20px 20px; margin:0;}
#question-list ul li.last {border:none;}
#question {display:inline; overflow:hidden;}

.smaller {font:85%/1.2 "tahoma",sans-serif;}
.smaller-red {font:85%/1.2 "tahoma",sans-serif;color:#9F0000}
.result-post {font:1.2em arial, tahoma; font-weight:bold; display:hidden;}
.pagit {border:1px solid #015A7C; background:#9FCFFF; padding:4px 6px 4px 6px;  font:1em "tahoma",sans-serif; 
color:#3C3C3C;text-decoration:none}
.pagit:hover{border:1px solid #015A7C; background:#46A2EC; padding:4px 6px 4px 6px;  font:1em "tahoma",sans-serif; 
color:#fff;text-decoration:none}
.currpagit,.currpagit:hover  {border:1px solid #015A7C; background:#1E67A4;padding:4px 6px 4px 6px; font:1em 
"tahoma",sans-serif;color:#fff;font-weight:bold;text-decoration:none}
#gallery-container { width: 590px; padding-left:20px; margin:0; overflow:hidden; } 
.gallery-row {padding:0; margin-bottom:20px; height:auto;  float:left;} 
.img { padding:10px 0px 0px 0px ; margin:0px 10px 0px 0px; width:160px; float:left; text-align:center; }
.img img {display:inline; margin:0px; border:5px solid #E0E0E0;}
.desc { text-align:center; width:auto; margin-top:2px;}

#book-container { width: 590px; padding:0; margin:0; overflow:hidden; } 
.gallery-row .book {min-height:250px; width:580px;  padding:0px 0px 0px 0px ; margin-bottom:0px 0px 20px 0px; border-bottom:1px solid #cdc;} 

.book .book-left { width:140px; min-height:130px; float:left; border:0px solid #cdc; float:left; }
.book-left .bookcover { width:125px; height:125px; padding:4px; margin:0px; border:1px solid #cdd; border:1px solid #cdc; }

.book .book-right {width:420px; border:0px solid #cdc; margin-left:12px;border:0px solid #cdc; float:left;}
.booktitle { font-size:15px;font-weight:bold; padding-bottom:5px; }

.booktools {height:25px; width:133px; padding-top:6px;margin:2px 0px 5px 0px; border:1px solid #cdc; background-color:#F0F0FF; color:#ffffff; font-size:11px;font-weight:bold; text-align:center}
.booktools span {margin-left:5px;}  

#loading { position: absolute; top: 0; left: 0; color: white; background-color: red; padding: 5px 10px; font: 12px Arial;}
div#qTip {padding: 10px; border: 1px solid #cdc; display: none; background: #fff; color: #515151; font:  11px Arial, Arial, sans-serif; text-align: left; position: absolute; z-index: 1000; }
.fader{opacity:0;display:none;}


/* ---------- scroller ---------- */
div.scrollingHotSpotLeft {min-width: 75px;width: 10%;height: 100%;background-image: url('../images/slider/big_transparent.gif');background-repeat: repeat;background-position: center center;position: absolute;z-index: 200;left: 0;cursor: url('../images/slider/cursor_arrow_left.png'), url('../mages/slider/cursor_arrow_left.cur'),w-resize;}
div.scrollingHotSpotLeftVisible{background-image: url('../images/slider/arrow_left.gif');background-color: #fff;background-repeat: no-repeat;opacity: 0.35; -moz-opacity: 0.35; filter: alpha(opacity = 35); zoom: 1;}
div.scrollingHotSpotRight{min-width: 75px;width: 10%;height: 100%;background-image: url('../images/slider/big_transparent.gif');background-repeat: repeat;background-position: center center;position: absolute;z-index: 200;right: 0;cursor: url('../images/slider/cursor_arrow_right.png'), url('../images/slider/cursor_arrow_right.cur'),e-resize;}
div.scrollingHotSpotRightVisible{background-image: url('../images/slider/arrow_right.gif');background-color: #fff;background-repeat: no-repeat;opacity: 0.35;filter: alpha(opacity = 35);-moz-opacity: 0.35;zoom: 1;}
div.scrollWrapper{position: relative;overflow: hidden;width: 100%;height: 100%;}
div.scrollableArea{position: relative;width: auto;height: 100%;margin-left:10px;}
#scrollable{margin:0px 0px 20px 0px;width:600px;height: 85px;position: relative;border:1px solid #cdc;}
#scrollable div.scrollableArea img{position: relative;float: left;padding:0px;margin:0px; border: none;}
#scrollable div.scrollableArea a{position: relative;padding:0px;margin:0px;display: block;float: left;}