@charset "utf-8";

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,
caption, tfoot {
	background: transparent;
	border: 0;
	outline: 0;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

.imgborder {
	border: 5px solid #660;
	border-radius: 8px;
}

:focus {
	outline: none;
}

body {
	font: normal 13px Arial, Helvetica, sans-serif;
	color: #000;
	height: 100%;
	z-index: 0;
	line-height: 1.5em;
	background: #fff url(../images/bg.png) no-repeat center center fixed;
	 -webkit-background-size: cover;
	 -moz-background-size: cover;
	 background-size: cover;
}

a {
	color: #fff;
	text-decoration: none;
	font-style: normal;
}

a:hover, a:active {
	color: #6C931B;
}

a.green {
	color: #6C931B;
}

a.detail-produk {
	color: #006600;
	font-weight: bold;
}

a.yellow {
	color: #FF0;
}

a.yellow:hover, a.yellow:active, 
a.green:hover, a.green:active, a.detail-produk:hover, a.detail-produk:active {
	text-decoration: underline;
}

.noise {
	/*background: #fff url(../images/background.png) repeat;*/
	background: url(../images/gridnoise.png) repeat;
	/*background: #441114 url(../images/bg.png) top center repeat-x fixed;*/
		background: #fff url(../images/bg.png) no-repeat center center fixed;
	 -webkit-background-size: cover;
	 -moz-background-size: cover;
	background: none;
}

div#top {
	width: 100%;
	position: relative;
	height: 175px;
}

div#logo {
	position: relative;
	top: 50px;
	width: auto;
	background: none;
	text-align:center;
}

span.green {
	color: #006600;
	font-weight: bold;
}

ul.menu li a:hover {
	color: #fff;
	text-shadow: -2px 2px 6px #fff;
}

div.manage {
	border: 1px solid #bbb;
	width: 170px;
	height: 160px;
	float: left;
	margin-left: 8px;
	text-align: center;
	overflow: hidden;
	padding: 8px 0;
	border-radius: 8px;
	background: #fff;
}

div.manage h3 {
	font-size: 12px;
}

div.manage img {
	max-width: 130px;
	margin-top: 4px;
}

div.produk {
	width: 730px;
	padding: 0;
	text-align: center;
	float: right;
	border: 1px solid #bbb;
	border-radius: 16px;
	margin-top: 8px;
}

div.items-produk {
	width: 170px;
	height: 260px;
	float: left;
	margin: 9px 0 36px 9px;
	padding: 8px 0;
	overflow: hidden;
}

div.detail-produk {
	width: 300px;
	height: 100%;
	float: left;
	margin: 9px 0 36px 9px;
	padding: 8px 0;
	overflow: hidden;
	text-align: center;
}

div.deskripsi-produk {
	width: 395px;
	text-align: left;
	padding-left: 16px;
}

div.deskripsi-produk p {
	margin-bottom: 16px;
}


div.detail-produk img {
	max-width: 300px;
	max-height: 300px;
	margin-top: 8px;
}

p.harga {
	margin-top: 8px;
	font-weight: bold;
	color: #900;
	letter-spacing: 1px;
}

div.items-produk img {
	max-width: 150px;
	max-height: 150px;
	margin-top: 8px;
}

div.new-produk {
	width: 960px;
	margin: 0 auto;
	padding: 0;
	text-align: center;
	border: 1px solid #bbb;
	border-radius: 16px;
}

div.items-new-produk {
	width: 220px;
	height: 290px;
	float: left;
	margin-left: 15px;
	padding: 8px 0;
	overflow: hidden;
}

div.items-new-produk img {
	max-width: 175px;
	max-height: 175px;
	margin-top: 6px;
}

div#topcontent {
	background: none;
	width: 960px;
	position: relative;
	margin: 0 auto;
}

div#wrapper {
	margin: 0 auto;
	width: 960px;
	border: 1px solid #bbb;
	padding: 0 32px 32px 32px;
	background: #fff;
	margin-bottom: 8px;
	position: relative;
	border-radius: 16px;
	box-shadow: 0 4px 5px #bbb;
}

div.moto {
	color: #777;
	letter-spacing: 1px;
	font: 14px Verdana, Geneva, sans-serif;
	margin-bottom: 0px;
	background: none;
	letter-spacing: 5px;
}

#top h1 {
	white-space: normal;
	font-size:39px; 
	margin: 18px 0; 
	letter-spacing: 2px; 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 39px
}

.grey {
	color: #777;
}

.red {
	color: #CC3333;
}

.green {
	color: #79A044;
}

#top h2 {
	font-size: 16px;
	font-weight: normal;
	letter-spacing: 2px;
	margin-top: 4px;
	white-space: normal;
	color: #222;
}

div#cart {
	position: absolute;
	right: 0;
	top: 85px;
	right: -8px;
	width: 200px;
	text-align: center;
	background: url(../images/bottom-slice.jpg) repeat-x;
	color: #FF6;
	padding: 4px 0;
	border-radius: 8px;
}

div.register {
	position: absolute;
	right: 0;
	top: 8px;
	width: 600px;
	overflow: hidden;
	text-align: right;
}

#logo h1, #bottom h1, #bottom h2 {
	color: #377395;
}

#contact h1, #contact h2 {
	color: #6C931B;
}

div#topmenu {
	height: 44px;
	background: none;
	position: absolute;
	bottom: -21px;
	z-index: 10;
	width: 100%;
	margin: 0 auto;
}

hr {
	border-color: #fff;
	margin: 8px 0;
}
	
div#menu {
	height: 44px;
	background: #000;
	position: relative;
	z-index: 10;
	width: 980px;
	margin: 0 auto;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	background: #060 url(../images/nav.png) top center repeat;
	letter-spacing: 1px;
	-webkit-box-shadow: 0 2px 3px rgba(0,0,0,0.4);
	-moz-box-shadow: 0 2px 3px rgba(0,0,0,0.4);
	box-shadow: 0 2px 3px rgba(0,0,0,0.4);
	text-shadow: 1px 1px #666;
}

div#middle {
	width: 100%;
	z-index: 0;
	position: relative;
	display: block;
	padding-bottom: 24px;
}

div.content {
	width: 960px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	background: none;
	padding: 16px 0;
}

div#bottom {
	width: 100%;
	position: relative;
	text-shadow: none;
	min-height: 360px;
}

div.bottomcontent {
	width: 32%;
	float: left;
}

div.satuan {
	background: none repeat scroll 0 0 #FAD37E;
    border: 1px solid #777777;
    clear: both;
    float: none;
    font-weight: bold;
    letter-spacing: 2px;
    margin: 8px auto;
    padding: 8px 48px;
    text-align: center;
}

div.footercontent {
	width: 25%;
	float: left;
}

div#footer {
	height: auto;
	width: 100%;
	margin-top: -16px;
}

div#middle, div#footer {
	background: none;
}

div#copyright {
	width: 960px;
	position: relative;
	margin: 0 0 16px 0;
	color: #111;
	padding: 8px 0;
	text-align:center;
	letter-spacing: 2px;
}

div.cleft {
	position: absolute;
	left: 0;
	top: 16px;
}

div.cright {
	position: absolute;
	right: 0;
	top: 16px;
}

ul.menu {
	list-style: none;
	padding: 0;
	margin:0;
}

ul.menu li {
	display: inline;
	float: left;
	margin: 14px 0;
	font-weight: bold;
	position: relative;
	vertical-align:middle;
	border-right: 1px solid #fff;
	padding: 0 0px;
	width: 150px;
	text-align: center;
}

ul.menu li a {
	color: #fff;
	text-decoration: none;
}

img.big {
	margin-top: 8px;
}

#bottom h2 {
	font-size: 20px;
	margin: 16px 0;
}

#bottom h1 {
	font-size: 24px;
	margin: 39px 0 8px 0;
	line-height: 1.3em;
}

#bottom h3 {
	color: #222;
	font-size: 16px;
}

.clear {
	clear: both;
}

#footer h3 {
	color: #fff;
	font-size: 18px;
	margin-top: 8px
}

div.bottomcontainer {
	margin: 20px 0 0 0;
	display: block;
	white-space: normal;
	background: #eee;
	padding: 20px 24px;
	line-height: 1.7em;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border: 1px solid #bbb;
}

ul.bottomlist {
	list-style: disc;
	margin: 8px 0 0 14px;
	color: #000;
}

ul.footerlist {
	list-style: none;
	margin: 16px 16px 0 0;
	color: #fff;
}

div.fitur {
	margin: 4px 0 0 14px;
	line-height: 1.8em;
}

h2.title, p.title {
	text-align: center;
	margin-top: 48px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 32px;
	color: #333;
	font-weight: normal;
}

p.title {
	font-size: 24px;
	margin-top: 24px;
}

div.mid {
	background: #fff url(../images/background.png) repeat;
	padding: 36px 0;
	margin-bottom: 0px;
	border-top: 5px solid #999;
	border-bottom: 5px solid #777;
	-webkit-box-shadow: 0 5px 10px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 5px 10px 3px rgba(0,0,0,0.5);
	box-shadow: 0 5px 10px 0px rgba(0,0,0,0.5);
	text-shadow: 1px 1px #fff;
}

div.mid h2 {
	color: #377395;
	margin-bottom: 16px;
	font-size: 24px;
}

.btnred {
	-moz-box-shadow:inset 0px 1px 0px 0px #f29c93;
	-webkit-box-shadow:inset 0px 1px 0px 0px #f29c93;
	box-shadow:inset 0px 1px 0px 0px #f29c93;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
	background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
	background-color:#fe1a00;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	border:1px solid #d83526;
	display:inline-block;
	color:#ffffff;
	font-family:arial;
	font-size:22px;
	font-weight:bold;
	padding:12px 42px;
	text-decoration:none;
	text-shadow:1px 1px 0px #b23e35;
}

.btnred:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
	background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
	background-color:#ce0100;
	color: #fff;
}

.btnred:active {
	position:relative;
	top:1px;
}

p.download {
	text-align: center;
	margin-top: 32px;
}

a.link {
	color: #377395;
}

a.link:hover, a.link:active {
	text-decoration: underline;
}

.nobullet {
	list-style-type: none;
	text-align: right;
}

.kategori {
	list-style-type: none;
	text-align: left;
	border: 3px solid #bbb;
	font-weight: bold;
}

ul.kategori li {
	padding: 8px;
	background: #eee;
	border-bottom: 1px solid #bbb;
}

.items {
	list-style-type: disc;
	padding: 4px 4px 4px 16px;
}

.nobullet li {
	list-style-type: none;
	padding-bottom: 4px;
}

div#heading {
	margin-top: 6px;
	float: left;
	border: 1px solid #759D42;
	margin-left: 10px;
	width: 455px;
	text-shadow: none;
	padding: 0;
	text-align: left;
	background: #FFFFCC;
	padding: 16px;
	border-radius: 8px;
}

div.iconpage {
	width: 200px;
	overflow: hidden;
	float: left;
	text-align: center;
}

div#rightmenu, div#leftmenu {
	float: right;
	width: 240px;
	padding: 8px 0 8px 16px;
	margin-top: 0px;
	border-right: 0px solid #bbb;
}

div#rightmenu h3, div#leftmenu h3 {
	background: #76b347 url(../images/nav.png) repeat-x bottom;
    -webkit-box-shadow: inset 0 1px 0 0 #8dbf67;
    -moz-box-shadow: inset 0 1px 0 0 #8dbf67;
    box-shadow: inset 0 1px 0 0 #8dbf67;
	padding: 6px 8px;
	margin:0px 0 8px 0;
	color: #fff;
	text-align: center;
	font-weight: bold;
	text-shadow: none;
	border-left: 8px solid #bbb;
	text-shadow: none;
}

div#leftmenu {
	width: 210px;
	float: left;
	padding: 8px 16px 8px 0;
	text-align: left;
}

.newcontent {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9) );
	background:-moz-linear-gradient( center top, #f9f9f9 5%, #e9e9e9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9');
	background-color:#f9f9f9;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:3px solid #bbb;
	display:inline-block;
	color:#666666;
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	font-weight:bold;
	padding:4px 18px;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
}

.newcontent:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9) );
	background:-moz-linear-gradient( center top, #e9e9e9 5%, #f9f9f9 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9');
	background-color:#e9e9e9;
	color: #666;
}

.newcontent:active {
	position:relative;
	top:1px;
	color: #666;
}

.deletecontent {
	-moz-box-shadow:inset 0px 1px 0px 0px #f29c93;
	-webkit-box-shadow:inset 0px 1px 0px 0px #f29c93;
	box-shadow:inset 0px 1px 0px 0px #f29c93;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #fe1a00), color-stop(1, #ce0100) );
	background:-moz-linear-gradient( center top, #fe1a00 5%, #ce0100 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fe1a00', endColorstr='#ce0100');
	background-color:#fe1a00;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:3px solid #444;
	display:inline-block;
	color:#ffffff;
	font-family: Arial, Helvetica, sans-serif;
	font-size:15px;
	font-weight:bold;
	padding:4px 18px;
	text-decoration:none;
	text-shadow:1px 1px 0px #b23e35;
}

.deletecontent:hover {
	color:#ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ce0100), color-stop(1, #fe1a00) );
	background:-moz-linear-gradient( center top, #ce0100 5%, #fe1a00 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ce0100', endColorstr='#fe1a00');
	background-color:#ce0100;
}

.deletecontent:active {
	color:#ffffff;
	position:relative;
	top:1px;
}
div.new {
	position: absolute;
	right: 32px;
	top: 50px;
}

.add-cart-btn {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color:#ededed;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	color:#777777;
	font-family:arial;
	font-size:12px;
	font-weight:bold;
	padding:2px 18px;
	text-decoration:none;
	text-shadow:1px 1px 0px #ffffff;
	margin-top: 8px;
}.add-cart-btn:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) );
	background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed');
	background-color:#dfdfdf;
}.add-cart-btn:active {
	position:relative;
	top:1px;
}

.marginleft16 {
	margin-left: 16px;
}

span.nobold {
	font-weight: normal;
}

.btnsave2 {
	-moz-box-shadow:inset 0px 1px 0px 0px #97c4fe;
	-webkit-box-shadow:inset 0px 1px 0px 0px #97c4fe;
	box-shadow:inset 0px 1px 0px 0px #97c4fe;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #3d94f6), color-stop(1, #1e62d0) );
	background:-moz-linear-gradient( center top, #3d94f6 5%, #1e62d0 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3d94f6', endColorstr='#1e62d0');
	background-color:#3d94f6;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #337fed;
	display:inline-block;
	color:#ffffff;
	font-family:arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:1px 1px 0px #1570cd;
	cursor: pointer;
}

.btnsave2:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1e62d0), color-stop(1, #3d94f6) );
	background:-moz-linear-gradient( center top, #1e62d0 5%, #3d94f6 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e62d0', endColorstr='#3d94f6');
	background-color:#1e62d0;
}

.btnsave2:active {
	position:relative;
	top:1px;
}


/* POSTING ONLY */

div#posting {
	margin-top: 0px;
	line-height: 1.75em;
	border-radius: 16px;
	font-size: 13px;
	text-shadow: none;
	padding: 32px 32px 16px 32px;
	background: #fff;
	border: 1px solid #bbb;
	width: 960px;
	margin: 0 auto;
}

#posting p, #posting div, #posting table, #posting ul, #posting ol, #posting h1,
#posting h2, #posting h3, #posting h4, #posting h5, #posting h6 {
	margin-bottom: 16px;
	color: #000;
	font-weight: normal;
}

#posting h1 {
	font-size: 24px;
	margin: 16px 0;
	line-height: 1.3em;
	color: #377395;
	font-weight: bold;
}

#posting img {
	max-width: 898px;
}

#posting img.right {
	float: right;
	padding: 5px;
	border: 1px solid #ccc;
	margin-left: 16px;
}

#posting img.left {
	float: left;
	padding: 5px;
	border: 1px solid #ccc;
	margin-right: 16px;
}

#posting img:hover {
	opacity: .9;
	filter: alpha(opacity = 90);
}

#posting sup {
	vertical-align: super;
}

#posting sub {
	vertical-align: sub;
}

#posting blockquote {
	margin: 0 0 16px 40px;
	border-left: 5px solid #ccc;
	padding: 16px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style: italic;
}

#posting a {
	color: #377395;
}

#posting a:hover {
	text-decoration: underline;	
}

#posting ul, #posting ol {
	padding: 0 40px;
}

#posting hr {
	border: 0px;
	border-top: 1px solid #ccc;
}

#posting pre {
	white-space: pre-wrap; /* CSS 2.1 */
	word-wrap: break-word; /* IE7 */
}

/* END POSTING ONLY */