html {
	margin: 0;
	padding: 0;
}

body {
	margin: 0;
	padding: 0;
	font-family: 'Trebuchet MS', 'Verdana', sans-serif;
	font-size: 13px;
	text-align: center;
	background: #d1cba1;
}

p, td, ul, ol, li, dt, dd {
	line-height: 20px;
}

.small, .pic-capt {
	line-height: 16px
}

#mainbody {
	position: relative;
	margin: 0 auto;
	padding: 0;
	width: 860px;
}

#header, #footer {
	position: relative;
	background: #da0688 url('../images/header-bg.jpg') repeat-y; 
}

#header {
	height: 100px;
	color: #ffffe6;
}

#header-sect {
	position: absolute;
	top: 25px; left: 20px;
	text-align: left;
	font-size: 40px;
	font-weight: normal; font-style: oblique;
	font-family: 'Georgia', sans-serif;
	color: #ffffe6;
}

#footer {
	height: 75px;
	text-align: right;
	padding-right: 10px;
	font-size: 13px;
}

#tabs { /*all tab*/
	position: relative;
	width: 100%;
}

.tabdf, .tabcr {
	position: relative;
	float: left;
	text-align: left;
}

.tabdf { padding: 0 1px 2px; background: #fdc9be; }
.tabcr { padding: 0 1px; }

.sectdf, .sectcr { /*width yes, padding yes, need inner*/
	position: static;
	height: 28px;
	padding-right: 10px;
}

.sectdf {	background: #fff; }

.icon {
	position: relative;
	top: 0.3em;
	margin-right: 5px;
	border: 0;
}

a.tabmn {
	margin-left: 10px;
	font-family: 'Georgia', sans-serif;
	font-weight: bold;
}

a.tabmn:link, a.tabmn:visited {
	color: #b30059;
	text-decoration: none;
}

a.tabmn:hover {
	color: #fd3c9c;
	text-decoration: none;
}

#search {
	position: absolute;
	top: 20px; right: 10px;
	height: 60px;
}

#pagebody {
	position: relative;
	border: 2px solid #fdc9be;
	background: #ffefef url('../images/pagebody-bg.jpg');
	width: 856px; /* width mainbody min 2x border thick */
}

#leftcol, #rightcol { /*width yes, can't padding*/
	position: relative;
	float: left;
}

#leftcol { width: 25% }
#rightcol {	width: 75% }

#leftcol-in {
	position: static;
	margin: 0 15px;
	padding-top: 10px;
	text-align: left;
}

#rightcol-in {
	position: static;
	padding: 10px 15px 10px 0;
}

#content {
	position: relative;
	background: #ffffe6 url('../images/parchment.jpg');
	border: 1px solid #d1cba1;
	padding: 30px 0;
	margin: 10px 0;
}

#sitepath, #copyright {
	position: relative;
	border-top: 1px solid #a3d0ff;
	border-bottom: 1px solid #a3d0ff;
	padding: 5px 10px;
	background: #d2f2ff url('../images/tissublue.jpg');
	color: #0018ff;
}

#sitepath {
	text-align: left;
}

#valid-box {
	position: absolute;
	top: 23px; left: 10px;
	width: 190px;
}

.valid {
	width: 50%; float: left;
}

#ip-box {
	position: absolute;
	bottom: 0; right: 20px;
}

a {	color: #000000;	text-decoration: none; }
a:link { color: #9803e9; }
a:visited {	color: #0080c0; }

.module {
	position: static;
	margin-bottom: 10px;
	padding: 0;
	background: #fff;
	border: 1px solid #d1cba1;
}

a.a-sect, a.a-menu {
	color: #a97700; font-weight: bold;
}

a.a-sect:visited, a.a-menu:visited {
	color: #765301; font-weight: bold;
}

a.a-sect:hover, a.a-menu:hover {
	color: #d3990e; font-weight: bold; text-decoration: underline;
}

a.child {
	color: #000000;
	text-decoration: none;
	font-weight: bold;
	margin-left: 5px;
}

a.child:link    { color: #0000ff; font-weight: normal; }
a.child:visited {	color: #0a357e;	font-weight: normal; }
a.child:hover   { color: #0377d9;	font-weight: normal; text-decoration: underline; }

ul {
	list-style-image: url('../images/li-bg.gif');
}

ol {
	margin-top: 5px; margin-bottom: 5px;
}

ul.menu {
	font-size: 13px;
	text-align: left;
	padding-left: 0;
	margin: 0;
	background: #fff;
}

li.li-sect {
	list-style: none;
	list-style-image: none;
	padding-left: 18px;
	border-top: 1px solid #d1cba1;
	background: #fcfcfb url('../images/li-section-bg.gif') 0.1em 0.4em no-repeat;
	line-height: 25px;
}

ul.ul-second { /*list of list*/
	list-style-image: url('../images/li2-bg.gif');
	padding-left: 15px;
}

ul.ul-child {
	font-size: 13px;
	text-align: left;
	padding-left: 0;
	margin-left: 0;
	background: #fff;
}

li.li-child {
	list-style: none;
	list-style-image: none;
	padding-left: 0;
	margin-left: 0;
	border-top: 1px solid #d1cba1;
	line-height: 24px;
	background: none;
}

h1 {
	font-weight: bold;
	font-size: 24px;
	color: #cc0000;
	text-align: center;
	margin: 0 auto 20px;
}

h1.comp {
	font-size: 20px;
	color: #e26b6b;
	margin-top: 0;
}

h1.headerSearch {
	font-weight: normal;
	font-size: 20px;
	color: #cc0000;
	text-align: center;
	margin-top: 10px;
	margin-bottom: 10px;
}

h1.module-title {
	height: 16px;
	color: #fff;
	margin: 0;
	padding: 5px 10px;
	font-family: 'Georgia', sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-align: left;
	background: #a97700;
}

h2 {
	font-weight: bold;
	font-size: 17px;
	color: #007cf9;
	margin-top: 15px;
	margin-bottom: 5px;
}

h2.sect {
	color: #FFFFFF;
	margin-top: 0;
	margin-bottom: 0;
}

h3 {
	font-family: 'Arial', cursive;
	font-weight: bold;
	font-size: 14px;
	color: #008080;
	margin-top: 15px;
	margin-bottom: 5px;
}

h3.child {
	margin-left: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
}

p {
	font-size: 13px;
	margin: 10px 0;
}

p.search {
	font-size: 18px;
	color: #cc0000;
}

em {
	color: #ff0080;
	font-style: normal;
}

blockquote {
	font-style: normal;
	margin: 10px 0;
	border-left: 3px solid #fdc9be;
	color: #0000a0;
	padding: 10px;
	background: url('../images/pagebody-bg.jpg');
}

blockquote.wudhu { padding: 5px;	background: none; }

dl.searchDesc {
	margin-top: 20px;
	margin-bottom: 20px;
}

dt {
	margin-top: 6px;
	font-weight: bold;
}

dt.searchTitle {
	margin-left: 0;
	margin-bottom: 8px;
	font-weight: normal;
}

dd {
	margin-left: 20px;
}

p.quote {
	margin-bottom: 8px;
}

p.author {
	text-align: right;
	margin-right: 50px;
	color: #0000cc;
}

table {
	position: relative;
	font-family: 'Trebuchet MS', 'Verdana', sans-serif;
	font-size: 13px;
	text-decoration: none;
	margin: 20px auto;
	border-spacing: 2px;
}

th {
	background-color: #b0d8ff;
	padding: 5px;
}

table.grey {
	background: #d1cba1;
	border-spacing: 1px;
}

table.itiraf { border-spacing: 0; }
table.flag { border-spacing: 5px; }

table.notation {
	background: #a97700;
	border-spacing: 1px;
	margin-left: 0;
}

td { padding: 5px; background: #fff0b3; }

td.white { padding: 3px; background: #fff; }
td.blue { padding: 3px; background: #e1f0ff; }

td.lyric { padding: 8px; text-align:left;}
td.symbol {	background: #fff;	padding: 5px; }

td.flagbox {
	background: #dcd3b8; width: 110px;
	padding: 10px;
	 text-align: center; vertical-align: top;
}

.small {
	font-size: 12px;
}

.bodytext {
	position: relative;
	margin: 0 auto;
	width: 500px;
	text-align: left;
}

.row { /* as <tr> */
	position: relative;
	margin: 0 auto;
}

.cell, .half, .third, .quarter { /* as <td> */
	position: relative;
	float: left;
}

/*identical cell*/
.half { width: 50% }
.third { width: 33% }
.quarter { width: 25% }

/*index home*/
.toc-box {
	position: relative;
	margin: 0 auto;
	width: 240px;
}

.toc-title {
	position: relative;
	height: 28px;
	background: #efdfc0;
	border-right: 2px solid #bda77c;
	border-bottom: 2px solid #bda77c;
	margin: 20px auto 0;
	text-align: left;
	font-size: 16px;
	font-weight: bold;
	color: #b30059;
	padding-left: 10px;
}

/*chord*/
.keyboard {
	position: relative;
	margin: 0 auto;
	width: 137px; height: 102px;
	background: url('../images/keyboard.gif');
}

.node-white {
	position: absolute;
	top: 80px;
	width: 12px; height: 12px;
	background: url('../images/node-white.gif') no-repeat;
}

.node-black {
	position: absolute;
	top: 40px;
	width: 11px; height: 11px;
	background: url('../images/node-black.gif') no-repeat;
}

.chord-row { position: relative; margin: 0 auto; width: 580px }
.chord-cell { position: relative; float: left; width: 33% }

.chord-title, .symbol-title {
	font-family: 'Arial', 'Tahoma', sans-serif;
	font-size: 20px; color: #007CF9;
	margin-top: 15px; margin-bottom: 5px;
}

/*notation*/
.tj { width: 70px }
.sr { width: 100px }
.ld { width: 58px }
.ep { width: 45px }
.ht { height: 50px }

/*children book*/
.box-serial {
	position: relative;
	width: 500px;
	text-align: left;
	background: #ededed;
	border-right: 2px solid #cccccc;
	border-bottom: 2px solid #cccccc;
	font-weight: bold;
	font-size: 20px;
	color: #cc0000;
	margin: 0 auto;
	padding: 5px 0 5px 15px;
}

.book-box {
	position: relative;
	width: 480px;
	margin: 0 auto;
	border: 1px solid #cccccc;
	text-align: left;
	padding: 15px;
}

.book-cover, .book-desc {
	float:left;
	text-align: left;
}

.book-cover { width: 30%; }
.book-desc { width: 70%; }

.book-title {
	color: #ff0000;
	font-weight: bold;
	font-size: 15px;
}

/* region */
.region { padding: 5px; position: relative; width: 500px; }
.cont-list {
	float: left;
	text-align: left;
	width: 215px;
	margin: 5px; padding: 10px;
}

h1.cont-name {
	font-size: 14px;
	margin-bottom: 5px;
}

h2.continent {
	margin-top: 0;
}

.cont-box {
	position: relative;
	width: 520px;
	margin: 15px auto;
	padding-bottom: 10px;
}

.mapcont {
	position: relative;
	padding-top: 10px;
	padding-left: 10px;
	margin: 10px 0;
}

.subcont {
	position: relative;
	padding-left: 20px;
	margin: 10px 0;
	text-align: left;
}

.toplink {
	position: absolute;
	top: 10px;
	right: 20px;
}

.globe {
	position: relative;
	top: 8px; border: 0;
}

/*shop*/
#profile, #aroma {
	text-align: center;
}

.logo {
	margin: 8px 0;
}

/*tectonic*/
.pic-capt, .source {
	font-size: 12px;
	margin-top: 5px;
}

.pic-capt {	text-align: left; font-weight: normal }
.source {	text-align: right; }

.pic-box {
	background: #fff;
	border: 1px solid #d1cba1;
	padding: 5px;
	margin: 10px auto;
}

.konvergen {
	color: #f00;
	font-size: 13px;
	margin-bottom: 5px;
}

/*earthquake*/
.scale-box {
	width: 560px;
	margin: 0 auto;
	background: #e8e5d4 url('../images/scale-bg.gif') repeat-y center;
}

.rit-box, .mmi-box {
	float: left;
	font-size: 12px;
	text-align: left;
	line-height: 16px;
	width: 230px;
}

.quake { float: left; width: 100px }
.mmi-box, .rit-box { padding: 5px 0 }

.mmi-num, .rit-num { float: left; width: 23px; font-weight: bold }
.mmi-des, .rit-des { float: left; width: 197px }

.mmi-num { text-align: right }
.mmi-num, .mmi-des, .rit-num, .rit-des { padding-left: 5px }

.scale-border {
	background: url('../images/scale-border.gif') no-repeat center bottom;
}

/*volcanic*/
.erup-box {
	position: relative;
	width: 540px;
	margin: 0 auto;
	text-align: left;
	padding: 0;
}

.erup-pic, .erup-desc {
	float:left;
	text-align: left;
}

.erup-pic { width: 35%; padding-top: 5px; }
.erup-desc { width: 65%; }

.erup-title {
	color: #ff0000;
	font-weight: bold;
	font-size: 15px;
}

/*estebel*/
.estebel-box {
	width: 540px;
	margin: 0 auto;
	text-align: left;
}

.produk {
	margin-top: 5px;
	font-weight: bold;
}

.kode {
	font-size: 12px;
	padding-left: 20px;
}

.estebel {
	text-align: center;
	width: 33%;
}

/*diffuser*/
.diffuser {	width: 520px; margin: 0 auto }

.petunjuk { width: 75%; text-align: left}
.ilustrasi { width: 25%; height: 150px }

/*direction*/
.lf { text-align: left }
.rg { text-align: right }
.cr { text-align: center }
.tp { vertical-align: top }
.md { vertical-align: middle }
.bt { vertical-align: bottom }

.dummy:after, .book-box:after, erup-box:after, .row:after, .chord-row:after, .estebel-box:after {
	display: block;
	content: " ";
	visibility: hidden;
	clear: both;
	height: 0.1px;
	font-size: 0.1em;
}