/* @override 
	http://localhost:8888/manggis/hyperstyles.css
	http://10.1.19.11/~Designcenter/Manggis/hyperstyles.css
	http://www.shameliniaga.com/hyperstyles.css
	http://10.1.19.11/~Designcenter/manggis/hyperstyles.css
	http://localhost:8888/Manggis/hyperstyles.css
*/

/*body {background:#313131 url('images/bodybg.jpg') top repeat-x; font:13px/1.5 Helvetica,Arial,'Liberation Sans',FreeSans,sans-serif; color:#7d7d7d; margin:0; padding:0;}*/

#4m {
	float: left;
}

#promo {
}


#buynow {
	margin-right: 20px;
}




body {
	font:13px/1.5 Helvetica,Arial,'Liberation Sans',FreeSans,sans-serif;
	color: #545454;
	margin:0;
	padding:0;
	background-color: #FFFFFF;
}

.roundcont {
	background-color: #9c0000;
	color: #fff;
}

.roundcont p {
	margin: 10px 20px;
}

#pp tbody tr td {
	padding-top: 2px;
	padding-bottom: 2px;
}

.roundtop { 
	background: url(images/baloon/tr.gif) no-repeat right; 
}

.roundbottom {
	background: url(images/baloon/br.gif) no-repeat right; 
}

img.corner {
   width: 15px;
   height: 15px;
   border: none;
   display: block !important;
}


#wrapper {width: 880px;
	margin-right: auto;
	margin-left: auto;
	background: #ffffff url(images/headerbg.jpg) no-repeat;
}

img#logo {
	margin-top: 25px;
	margin-left: 116px;
	float: left;
}
#header {width: 800px; height: 140px; margin: 0 auto;
}
#intro {width: 800px; margin: 0 auto;}

#footer {width: 850px; margin: 0 auto; text-align: right;}
#footer p {color:#666666; font-size:11px;}
.left {float:left;} .right {float:right;}

#flashintro {width: 800px; height: 276px;background:url('images/introbg.jpg') top no-repeat;}
#intro-left {width:340px; float:left;position:relative;}

#pageintro {width: 800px; height: 120px;background:url('images/pageintrobg.jpg') top no-repeat;}
#pageintro img {padding: 28px 0 0 25px;}

#testimoni img {
	float: right;
	width: 120px;
	height: 120px;
	margin-left: 5px;
	padding: 5px;
	border: 1px solid #dcdcdc;
}

#content-main {margin: 30px 10px 0 10px;overflow: hidden;}
#content-main h1 {border-bottom: #d0d0d0 solid 1px; padding:0 0 10px 0; margin: 0 0 25px 0; font-size: 12px;}

#content-left {width: 520px; float:left;}

div#garisan {
	border-bottom: 1px solid #eaeaea;
	float: left;
	width: 800px;
	margin-bottom: 25px;
}
#content-left h2 {margin: 0 0 12px 0;padding: 0 0 0 0; font-weight: normal; font-size: 16px; font-weight:bold; }
#content-right {float:right;}
#content-right2 {
	float: right;
	margin-right: 32px;
}
#content-right img {border:0;}

#content-left p.headline_box {background:url('images/icon_box.jpg') no-repeat top left;color:#508623;font-size:15px;height:38px;padding:8px 0 0 48px;margin:20px 0 15px 0; }
#content-left p.headline_paint {background:url('images/icon_paint.jpg') no-repeat top left;color:#508623;font-size:15px;height:30px;padding:8px 0 0 43px;margin:15px 0 10px 0; }


#content-left-pelan { float:left;}

#content-left-pelan table {
	margin-left: 10px;
}
#content-left-pelan h2 {margin: 0 0 12px 0;padding: 0 0 0 0; font-weight: normal; font-size: 16px; font-weight:bold; }

#content-left-pelan p.headline_box {background:url('images/icon_box.jpg') no-repeat top left;color:#508623;font-size:15px;height:38px;padding:8px 0 0 48px;margin:20px 0 15px 0; }
#content-left-pelan p.headline_paint {background:url('images/icon_paint.jpg') no-repeat top left;color:#508623;font-size:15px;height:30px;padding:8px 0 0 43px;margin:15px 0 10px 0; }



#package {border: #d0d0d0 solid 1px; padding: 6px; overflow: hidden; margin: 0 0 15px 0; background:url('images/package_bottom.jpg') bottom repeat-x;}
#package:hover {border: 1px solid #8ac449;}
#package-icon {width:75px; height:75px; float:left; padding-right: 10px;}
#package-icon img {border:0;}
#package-text {float:left; width: 410px;}
#package h2 {margin: 0 0 12px 0;padding: 6px 0 0 0; font-weight: normal; font-size: 18px; }

ul.packagelist {margin:0 0 10px 5px;padding:0;list-style:none;font-size: 12px;font-style: italic;font-weight: bold;}

ul.packagelist li {display:block;background:url('images/tick3.jpg') 0 3px no-repeat;margin:2px 0 0 3px;padding:2px 0 5px 28px;border-bottom:1px solid #e1e1e1;}

ul.packagelist li.manggosteen_icon {background: url(images/small_mangosteen.jpg) no-repeat 0 3px;}
ul.packagelist li.hosting {background:url('images/icon_hosting.jpg') 0 3px no-repeat;}
ul.packagelist li.domain {background:url('images/icon_domain.jpg') 0 3px no-repeat;}
ul.packagelist li.email {background:url('images/icon_email.jpg') 0 3px no-repeat;}
ul.packagelist li.maintenance {background:url('images/icon_maintenance.jpg') 0 3px no-repeat;}
ul.packagelist li.backup {background:url('images/icon_backup.jpg') 0 4px no-repeat;}
ul.packagelist li.stats {background:url('images/icon_stats.jpg') 0 3px no-repeat;}

p.headline_icon_big_hosting {background:url('images/icon_big_hosting.jpg') no-repeat top left;color:#22719c;font-size:15px;height:30px;padding:5px 0 0 38px;margin:5px 0 0 0;font-weight:bold; }
p.headline_icon_big_maintenance {background: url(images/testimoni/manggis.jpg) no-repeat;color:#22719c;font-size:15px;height: 40px;margin: 5px 0 0;font-weight:bold;
	padding: 5px 1px 0 50px;
}

p#testimoni {
	padding-left: 50px;
	margin: 0 0 25px;
}
p.headline_icon_big_backup {background:url('images/icon_big_backup.jpg') no-repeat top left;color:#22719c;font-size:15px;height:30px;padding:5px 0 0 38px;margin:5px 0 0 0; font-weight:bold; }
p.headline_icon_big_optimisation {background:url('images/icon_big_optimisation.jpg') no-repeat top left;color:#22719c;font-size:15px;height:30px;padding:5px 0 0 38px;margin:5px 0 0 0;font-weight:bold;  }
p.headline_icon_big_stats {background:url('images/icon_big_stats.jpg') no-repeat top left;color:#22719c;font-size:15px;height:30px;padding:5px 0 0 38px;margin:5px 0 0 0; font-weight:bold; }

#package-left {width:256px; float:left;}

#package-left2 {width:500px; float:left;}

li.manggosteen_icon2 {
	background: url(images/tick_shamelinniaga.jpg) no-repeat 0 3px;
	padding-left: 23px;
	padding-bottom: 4px;
	border-bottom: 1px solid #e1e1e1;
	list-style-image: none;
}

#additional2 img {border:0;}
#additional-inner2 {background-color:#f0f0f0; padding: 4px;}
#additional-inner2 p {margin:0;}
#additional-inner2 h3 {margin:0;}

#additional {border: 1px solid #d0d0d0; padding: 4px; width: 225px;}

#additional2 {border: 1px solid #d0d0d0; padding: 4px; width: 160px;
	margin-left: auto;
	margin-top: 10px;
	clear: none;
}

#additional img {border:0;
	float: right;
}

#wait {
	font-weight: normal;
	font-style: normal;
	float: right;
	color: #f96739;
}
#additional-inner {background-color:#f0f0f0; padding: 4px;}
#additional-inner p {margin:0;}
#additional-inner h3 {margin:0;}

p.adds {background:url('images/addicon.jpg') no-repeat top left;color:#5e8b36;font-size:14px;height:30px;padding:5px 0 0 40px;margin:5px 0 10px 0; }
ul.reps {margin:10px 0 10px 0;padding:0;list-style:none;color: #666;font-family: Helvetica, Arial, sans-serif;font-style: normal;font-weight: bold;}
ul.reps li {width:94%;display:block;background: url(images/arrow.png) no-repeat 0 2px;margin:0 0 0 5px;padding:1px 0 5px 20px; font-size: 11px;}
ul.reps li a{color:#4f4f4f;}
ul.reps li a:hover{color:#84a937;}


ul.repswait {margin:10px 0 10px 0;padding:0;list-style:none;color: #666;font-family: Helvetica, Arial, sans-serif;font-style: normal;font-weight: bold;}
ul.repswait li {
	width: 94%;
	display:block;
	background: none no-repeat 0 2px;
	padding: 1px 0 5px 5px;
	font-size: 11px;
	list-style-type: decimal;
	margin-left: 20px;
}
ul.repswait li a{color:#4f4f4f;}
ul.repswait li a:hover{color:#84a937;}

.crumbs {float:right; font-weight:bold; padding-top: 3px;}

span.morecontent { font-weight:bold; padding-top: 3px;
	margin-left: 400px;
}

p.contacting {background:url('images/addicon2.jpg') no-repeat top left;color:#5e8b36;font-size:14px;height:30px;padding:5px 0 0 40px;margin:5px 0 10px 0; }

.portwrap {width: 520px;}
.portwrap p {margin:0;}

#twitter {width: 780px; margin: 0 auto; height: 33px; background:url('images/twitterbg.jpg') top no-repeat; padding-bottom: 30px;}
#twitter p {font-size:12px;margin:0;padding:0;}
#twitter-inner {padding: 8px 0 0 60px; float:left; width: 600px;}
#twitter-button {float:right; width: 99px; height: 33px; padding: 6px 18px 0 0;}
#twitter-button img {border:0;}

.port-left {float: left;padding-right: 30px;width: 152px;margin-bottom: 15px;}
.port-center {float: left;padding-right: 30px;width: 152px;margin-bottom: 15px;}
.port-right {float: left;width: 152px;margin-bottom: 15px;}

a img.portfolio_th {
	border: 1px solid #cccccc;
	padding: 5px;
	margin-bottom: 5px;background-color:#f0f0f0;
}		

a:hover img.portfolio_th {
	background-color: #7bba47;
}

.portfolio_info { 
	line-height: 17px;
	font-size: 11px;
}

.post_title, .portfolio_title { 
	font-size: 13px;
	line-height: 16px;
}







/* Blocks
-------------------------------------------------------------- */
.block { margin: 0 0 20px 0; float:left; width: 240px;}
.block h2 {margin: 0 0 12px 0;padding: 6px 0 0 0; font-weight: normal; font-size: 16px; font-weight:bold; }
.block h2 a:visited {font-weight:  normal; }
.block .icon {background: url('images/sprites-home.jpg') no-repeat 0 0; display: block; float: left; width: 50px; height: 50px; text-indent: -9999px; margin: 0 10px 0 0;}
.designdev .icon {background-position: 0px 4px;}
.codingopt .icon {background-position: 0px -105px;}
.promomarkt .icon {background-position: -0px -218px;}


#navbg {height:41px;background:url('images/navbg.jpg') repeat-x;}

div#introtitle2 {
	float: left;
	position: absolute;
	width: 154px;
	height: 152px;
	background: url(images/badge.png) no-repeat;
	margin-left: -110px;
	margin-top: -80px;
}

#navigation{display:inline;padding: 0px; margin:0;list-style:none;}
#navigation li a{display: block; text-indent: -9999px;}
#navigation li {float:left;}
	
#nav-home a {outline:none; margin-left: 15px;text-indent: -1000em;background:url('images/nav-home.jpg') no-repeat left top;width: 105px;height: 41px;display: block;overflow: hidden;}
#nav-home a:hover {background-position: 0px -41px; }
#nav-home-on a {outline:none;text-indent: -1000em;background:url('images/nav-home.jpg') no-repeat left top;width: 105px;height: 41px;display: block;overflow: hidden;position:0px;background-position: 0px -82px; }
			
#nav-produk a {outline:none;text-indent: -1000em;background: url(images/nav-produk.jpg) no-repeat left top;width: 105px;height: 41px;display: block;overflow: hidden;}
#nav-produk a:hover {background-position: 0px -41px; }
#nav-produk-on a {outline:none;text-indent: -1000em;background:url('images/nav-produk.jpg') no-repeat left top;width: 105px;height: 41px;display: block;overflow: hidden;background-position: 0px -82px; }
		
#nav-plan a {outline:none;text-indent: -1000em;background: url(images/nav-plan.jpg) no-repeat left top;width: 145px;height: 41px;display: block;overflow: hidden;}
#nav-plan a:hover {background-position: 0px -41px; }
#nav-plan-on a {outline:none;text-indent: -1000em;background: url(images/nav-plan.jpg) no-repeat 0px -82px;width: 105px;height: 41px;display: block;overflow: hidden;position: absolute; }
		
#nav-testimoni a {outline:none;text-indent: -1000em;background: url(images/nav-testimoni.jpg) no-repeat left top;width: 110px;height: 41px;display: block;overflow: hidden;}
#nav-testimoni a:hover {
	background: url(images/nav-testimoni.jpg) 0px -41px;
}
#nav-testimoni-on a {outline:none;text-indent: -1000em;background:url('images/nav-about.jpg') no-repeat left top;width: 105px;height: 41px;display: block;overflow: hidden;position: absolute;background-position: 0px -82px; }

#nav-daftar a {outline:none;text-indent: -1000em;background: url(images/nav-daftar.jpg) no-repeat 0 top;width: 105px;height: 41px;display: block;overflow: hidden;}
#nav-daftar a:hover {background-position: 0px -41px; }
#nav-daftar-on a {outline:none;text-indent: -1000em;background: url(images/nav-contact.jpg) no-repeat 0px -82px;width: 105px;height: 41px;display: block;overflow: hidden;position: absolute; }

#nav-hubungi a {outline:none;text-indent: -1000em;background: url(images/nav-hubungi.jpg) no-repeat left top;width: 105px;height: 41px;display: block;overflow: hidden;}
#nav-hubungi a:hover {background-position: 0px -41px; }
#nav-hubungi-on a {outline:none;text-indent: -1000em;background: url(images/nav-hubungi.jpg) no-repeat 0 -82px;width: 105px;height: 41px;display: block;overflow: hidden;position: absolute;
}

#nav-clientlogin a {outline:none;text-indent: -1000em;background:url('images/nav-clientlogin.jpg') no-repeat left top;width: 105px;height: 41px;display: block;overflow: hidden;
}

marquee {
	width: 235px;
	margin-top: 58px;
	height: 165px;
	margin-left: 15px;
}
#nav-clientlogin a:hover {background-position: 0px -41px; }
#nav-clientlogin-on a {outline:none;text-indent: -1000em;background:url('images/nav-clientlogin.jpg') no-repeat left top;width: 117px;height: 41px;display: block;overflow: hidden;position: absolute;background-position: 0px -82px;
}

#nav-right {float:right;margin-right:15px;}


ul, li {margin: 0;padding: 0;}

ul.packagelist li.design {background:url('images/icon_design.jpg') 0 3px no-repeat;}
	
.container { width: 265px; height: 276px; overflow:hidden; position:relative; cursor:pointer; margin-left: 89px;}
.slides { position:absolute; top: 41px; left:0; }
.slides div { position:absolute; top: 20px; width: 255px; display:none;
	right: 10px;
	margin-left: 20px;
	margin-top: 10px;
}
#loopedSlider { width: 400px; position:relative; clear:both; float:right;background: url(images/sliderbg.jpg) no-repeat;}


.previous {text-indent: -9999px; position:absolute; border:none;outline:none;cursor:pointer;top:115px;left: 65px;background:url('images/slider/intro_previous.png') no-repeat;width:42px;height:42px;}
.next {text-indent: -9999px; position:absolute;border:none;outline:none;cursor:pointer;top:115px;right: 25px;background:url('images/slider/intro_next.png') no-repeat;width:42px;height:42px;}
.previous:hover {background:url('images/slider/intro_previous_on.png') no-repeat;}
.next:hover {background:url('images/slider/intro_next_on.png') no-repeat;}

.viewpackages {outline:none;text-indent: -9999px;position:absolute; top: 205px; left:28px; border:none;background:url('images/intro_button_packages.jpg') no-repeat;width:140px;height:29px;}
.viewportfolio {outline:none;text-indent: -9999px; position:absolute; top: 205px; left:190px;border:none;background:url('images/intro_button_portfolio.jpg') no-repeat;width:140px;height:29px;}

#logoright img {
	margin-left: 60px;
	margin-bottom: 10px;
}

div#introtitle {
	float: left;
	position: absolute;
	width: 332px;
	height: 129px;
	background: url(images/introtitle.png) no-repeat;
	margin-left: 28px;
	margin-top: 20px;
}

div#introtext {
	float: left;
	position: absolute;
	width: 332px;
	margin-left: 28px;
	background-repeat: no-repeat;
	margin-top: 145px;
	color: #487127;
	font: 1.1em/1.7em "Lucida Grande", Lucida, Verdana, sans-serif;
}

div#contactinfo {
	float: right;
	margin-top: 51px;
}

#contactinfo a {
	text-decoration: none;
	color: #850a12;
}
#contactinfo a:hover {
	text-decoration: underline;
}

#contactinfo strong {
	color: #850a43;
	font-weight: bold;
}




.viewpackages:hover {background:url('images/intro_button_packages2.jpg') no-repeat;}

div#maintitle {
	color: #4d8a25;
	font-size: 1.7em;
	border-bottom: 1px solid #eaeaea;
	padding-bottom: 10px;
	margin-bottom: 15px;
}

.viewportfolio:hover {background:url('images/intro_button_portfolio2.jpg') no-repeat;}

#footer a:link {
	color: #666666;
}
#footer a:visited {
	color: #666666;
}
#footer a:hover {
	color: #7f7f7f;
}
#footer a:active {
	color: #666666;
}

a:link {
	color: #538734;
}
a:visited {
	color: #6CAE44;
}
a:hover {
	color: #9AD233;
}
a:active {
	color: #6CAE44;
}

/* Normal Bubble */
div.bubble {
	width: auto;
	margin: 15px 0 30px 0
}

div.bubble blockquote {
	margin: 0px;
	padding: 0px;
	border: 1px solid #b8dda3;
	background-color: #e5f2de;
}

div.bubble blockquote p {
	margin: 15px;
	padding: 0px;
	font-style:italic;
	font-size:16px;
	font-family:Georgia, "Times New Roman", Times, serif;
}

div.bubble cite {
	position: relative;
	margin: 0px;
	padding: 9px 0px 0px 15px;
	top: 6px;
	background: transparent url('images/tip.gif') no-repeat 20px 0;
	font-style: normal;
}

.tweet {font-size: 12px;}
.tweet .tweet_list {list-style-type: none;margin: 0; padding: 0;}
.tweet .tweet_list li {overflow: auto;padding: 0; }
.tweet .tweet_list li a { color: #538734; }

fieldset {border:0; margin:0; padding:0;}

/* ---------------------------------------------------------------- 
 *  Contact Forms & Tool Tip
 * ---------------------------------------------------------------- 
*/ 

#thank_you_right {
	display: none; margin:0; padding:0;
}
#quoteForm input.textfield, #quoteForm textarea,
#contactForm input.textfield, #contactForm textarea {
	padding: 7px 5px;
	width: 320px;
	font-size: 13px;
	color: #525861;
	font-family: Arial, Helvetica, sans-serif;
	margin-bottom: 10px;
}



#txtbox {
		border: 1px solid #d2d2d2;
	background: #fff;
	padding: 7px 5px;
	width: 150px;
	font-size: 13px;
	color: #525861;
	font-family: Arial, Helvetica, sans-serif;
	margin-bottom: 10px;
}

#submit2 {
	width: 100px;
}

input#captcha {
	width: 70px;
}

img#graph {
	margin-left: 90px;
	padding: 5px;
	border: 1px solid #e1e1e1;
}

#logForm table.loginform tbody tr td {
	padding-right: 10px;
}

#package-text p img {
	border: 1px solid #e1e1e1;
	float: right;
	margin-left: 5px;
	padding: 3px;
}

#quoteForm .validation-failed,
#contactForm .validation-failed {
	border: 1px dashed #c72121;
}
#quoteForm button,
#contactForm button {
	width: 140px;
	height: 29px;
	text-indent: -9999px;
	border: none;
	cursor: pointer;
}

#logForm button {
	width: 140px;
	height: 29px;
	text-indent: -9999px;
	border: none;
	cursor: pointer;
}

#logForm button#doLogin3 {
	background: url(images/submit2.jpg) no-repeat 0 0;
	margin-top: 10px;
}

#logForm button#doLogin3:hover {
	background-position: 0 -29px;
}

#doLogin3 {
}

#logForm table.loginform tbody tr td div p a {
	margin-left: 20px;
}

#quoteForm button#submit1,
#contactForm button#submit2 {
	background: url(images/submit2.jpg) no-repeat 0 0;
	margin-top: 10px;
}
#quoteForm button#submit1:hover,
#contactForm button#submit2:hover {
	background-position: 0 -29px;
}
.mail {
	display: none;
}
.user_tip {
	display: none;
}
.f-tooltip {
    background: #93d165 url(images/tip_background.png) repeat-x 0 0;
    width: 148px;
    padding: 10px 10px;
    border: 1px solid #7bad51;
    color: #3e4f2f;
    font-size: 11px;
    text-align: center;
}
.f-tooltip div.right-arrow {
    position: absolute;
    right: -15px;
    width: 15px;
    height: 15px;
    top: 12px;
    background: url(images/tip_arrow_right.png) no-repeat 0 0;
}
.f-tooltip div.left-arrow {
    position: absolute;
    left: -15px;
    width: 15px;
    height: 15px;
    top: 12px;
    background: url(images/tip_arrow_left.png) no-repeat 0 0;
}

div#jusbox {
	width: 246px;
	height: 157px;
	float: left;
	margin-right: 10px;
	margin-bottom: 10px;
	background-image: url(images/magosteen_shamelin_box.jpg);
}

#myname {
	color: #003f83;
	font-weight: bold;
	font-size: 1.2em;
}

/* button pembayaran */ 
 .add{
		background:url(img/money_dollar.png) no-repeat 10px 8px;
		text-indent:30px;
		display:block;
	text-decoration: underline;
}
	
	a.button{
	background:url(img/button.gif);
	display:block;
	color:#555555;
	font-weight:bold;
	height:30px;
	line-height:29px;
	margin-bottom:14px;
	text-decoration:none;
	width:191px;
}
a:hover.button{
	color:#0066CC;
}