@charset "utf-8";
/* CSS Document */

body.earth-day{
 background:url(../images/bg/bodybg.gif) no-repeat bottom center fixed;
}
body.idul{
 background:url(../images/bg/idul-fitri-bg.jpg) no-repeat bottom center fixed;
}
.container_12 .grid_3 {
 width:240px;
}
.container_12 .grid_8{
 width:640px;
}


body .grid_12{
width:960px;
margin-left:0;
margin-right:0;
}
.bg-top{
background:url(../images/bg/main-bg.gif) repeat-x;
}

.bg-btm{
background:url(../images/bg/footer-bg.gif) repeat-x bottom;
}
.page-wider{
width:960px;
margin:0 auto;
position:relative;
}

#page-wrapper{
 overflow:hidden;
}
#header{
 height:86px;
 position:relative;
 z-index:100;
}
#logo{
 position:absolute;
 top:37px;
 left:30px;
 z-index:101;
}
#logo a{
 background:url(../images/bg/wowrack_logo.gif) no-repeat;
 width:284px;
 height:77px;
 display:block;
}
#slogan{
 position:absolute;
 top:62px;
 left:50px;
 color:#afafaf;
}

/****************/
/* PRIMARY MENU */
/****************/

#primary-menu {                                   /* menu layout */
  display: block;
  font-size: 14px;
  margin-top: 0px;
  padding: 0;
  position:absolute;
  right:15px;
  top:66px;
  z-index:5;
}

#primary-menu ul.links li {                       /* text styling for the top (primary) menu */
}  

#primary-menu ul.links li.first {                 /* .first and .last classes applied to first and last menu & list items */
}
  
#primary-menu ul.links li.last {                  /* .first and .last classes applied to first and last menu & list items */
}
  
#primary-menu ul.links li a:link,
#primary-menu ul.links li a:visited {
}

#primary-menu ul.links li a:hover,
#primary-menu ul.links li a:active {
}  
  

/************************************/
/* PRIMARY MENU WITH DROPDOWNS      */
/* - used with menu_tree theming of */
/* $primary_links in page.tpl.php   */
/************************************/

#primary-menu ul.menu li {                        /* top item layout */
  background: ;
  display: block;
  float: left;    /* LTR */
  margin: 0 1px 0 0;
  padding: 0 0 0 0.7em;    /* 0 0 0 10px */
  position: relative;
  width:  auto;
  background:url(../images/bg/primary-bg.gif) no-repeat left 5px;
}


#primary-menu ul.menu li:hover,
#primary-menu ul.menu li.hover,
#primary-menu ul.menu li.active-trail{
  background:url(../images/bg/primary-bg.gif) no-repeat left top;
}

#primary-menu li.last, #primary-menu li.last a{
  background-image: url('..images/bg/primary-links-last-bg.gif');
}  

#primary-menu ul.menu li a {
  background:url(../images/bg/primary-bg.gif) no-repeat right 5px;
  font-weight:bold;
  display: block;
  padding: 1.2em 0.7em 1.47em 0;    /* 5px 10px 1px 0 */
  text-decoration: none;
  font-size:14px;
  color:#3a8196;
  display:block;
}

.ie7 #primary-menu ul.menu li{
 
}

#primary-menu ul.menu li.last a{
}
#primary-menu ul.menu li a:hover,
#primary-menu ul.menu li:hover a,
#primary-menu ul.menu li.hover a{
  background-position: top right;
  padding-top:0.9em; 
}

#primary-menu ul.menu li.active-trail a{
  padding-top:0.9em;
  background-position: top right;
  color: #4a565a;
}

/* 2nd level */

#primary-menu ul.menu li ul {
  margin: -5px 0 0 0;    /* LTR */
  display:none;
  position:absolute;
  background-color:#EFEFEF !important;
  margin-left:-20px;
  padding:2px 10px 10px;
  position:absolute;
  top:100%;
  width:220px;
  filter:alpha(opacity=95); /* IE */
  opacity: 0.95; /* Safari, Opera */
  -moz-opacity:0.95; /* FireFox */
}

#primary-menu ul.menu li:hover ul,
#primary-menu ul.menu li.hover ul {
  display: block;
  left:auto;
    /* LTR */
}
#primary-menu ul.menu li ul li{
  float:none;
  list-style:none;
  padding:0 10px;
  background:none;
}
#primary-menu ul.menu li ul li a {
  padding: 2px;
  font-size:12px;
  background:none;
}

#primary-menu ul.menu li ul li:hover,
#primary-menu ul.menu li ul li.hover a{
  background:none;
}
  
#primary-menu ul.menu li ul li a:hover{
  text-decoration:underline;
}

#primary-menu ul.menu li.last ul{
 right:0;
}
#primary-menu ul.menu li.last ul li{
  text-align:right;
}

  

/****************/
/* SECONDARY MENU */
/****************/

#secondary-menu {                                   /* menu layout */
  display: block;
  font-size: 11px;
  margin-top: 0px;
  padding: 0;
  position:absolute;
  right:15px;
  top:10px;
  z-index:6;
}

#secondary-menu ul.links li {                       /* text styling for the top (secondary) menu */
}  

#secondary-menu ul.links li.first {                 /* .first and .last classes applied to first and last menu & list items */
}
  
#secondary-menu ul.links li.last {                  /* .first and .last classes applied to first and last menu & list items */
}
  
#secondary-menu ul.links li a:link,
#secondary-menu ul.links li a:visited {
}

#secondary-menu ul.links li a:hover,
#secondary-menu ul.links li a:active {
}  
  

/************************************/
/* secondary MENU WITH DROPDOWNS      */
/* - used with menu_tree theming of */
/* $secondary_links in page.tpl.php   */
/************************************/

#secondary-menu ul.menu li {                        /* top item layout */
  display: block;
  float: left;    /* LTR */
  margin: 0 1px 0 0;
  padding: 0 0 0 0em;    /* 0 0 0 10px */
  position: relative;
  width:  auto;

}


#secondary-menu ul.menu li:hover,
#secondary-menu ul.menu li.hover,
#secondary-menu ul.menu li.active-trail{

}

#secondary-menu ul.menu li a {
  margin-right:20px;
  font-weight:bold;
  display: block;
  padding: 0em 1em 0em 0;    /* 5px 10px 1px 0 */
  text-decoration: none;
  font-size:11px;
  color:#3a8196;
}
#secondary-menu ul.menu li.last a{
 margin-right:0;
}
#secondary-menu ul.menu li a:hover,
#secondary-menu ul.menu li:hover a,
#secondary-menu ul.menu li.hover a{
 text-decoration:underline;
}

#secondary-menu ul.menu li.active-trail a{

  color: #4a565a;
}

#secondary-menu ul.menu li ul {
 /* background: transparent url('images/drop-bottom.png') no-repeat 0 bottom;*/
  left: -999em;
  opacity: 0.95;
  margin: 0 0 0 -10px;
  padding: 2px 0 4px;
  position: absolute;
  width: 144px;
  z-index: 2;
}
  
#secondary-menu ul.menu li:hover ul,
#secondary-menu ul.menu li.hover ul {
  display: block;
  left: auto;
}
  
#secondary-menu ul.menu li ul li {
  background: #94CE18;
  border-bottom: 1px solid #83A638;
  float: left;
  font-size: 0.916em;
  height: auto;
  margin: 0;
}

#secondary-menu ul.menu li ul li.last {
  border-bottom: none
}

#secondary-menu ul.menu li ul li a,
#secondary-menu ul.menu li ul li a:link,
#secondary-menu ul.menu li ul li a:visited {
  background: transparent;
  color: #154B6F;
  display: block;
  margin: 0;
  padding: 4px 0;
  text-transform: none;
  width: 135px;
}

#secondary-menu ul.menu li ul li a:hover {
  color: #fff;
  display: block;
  margin: 0;
  padding: 4px 0;
  text-decoration: none;
}

#secondary-menu ul.menu li ul li ul.menu {
  left: -999em;
  margin: 0 0 0 -14px;    /* LTR */
  padding: 6px 0 4px;
}

#secondary-menu ul.menu li ul li:hover ul.menu,
#secondary-menu ul.menu li ul li.hover ul.menu {
  display: block;
  left: 154px;    /* LTR */
  top: -6px;
}

#secondary-menu ul.menu li ul li ul.menu li a {
  padding: 4px;
  width: 128px;
}
  
#secondary-menu li.last, #secondary-menu li.last a{

}  

#secondary-menu #twitter a{
  background:url(../images/bg/social-icon.gif) no-repeat right -33px;
  padding-right:20px;
}
#secondary-menu #facebook a{
  background:url(../images/bg/social-icon.gif) no-repeat right -16px;
  padding-right:20px;
}
#secondary-menu #chat a{
  background:url(../images/bg/social-icon.gif) no-repeat right 0px;
  padding-right:20px;
}

#main-content{
 display:inline;
 float:left;
 position:relative;
 width:960px;
 z-index:0;
}


#content-wrapper{
 background:url(../images/bg/content-bg.gif) no-repeat 0 2px;

}
#sidebar-first-wrapper{

}

.content{
 padding-left:20px;
 padding-right:20px;
}
.w-left{
  margin-left:30px;
}
.w-right{
  margin-left:18px;
}
#sidebar-last-wrapper{
  width:255px;
}
#content{
}
#top-main{
width:100%;
display:inline;
height:290px;
float:left;
position:relative;
overflow:visible;
background:url(../images/bg/banner-bg.gif) no-repeat center top;
}
.server-img{
position:absolute;
z-index:1;
top:-5px;
right:-20px;

}
.banner{
background:url(../images/bg/banner-all.gif) no-repeat center;
width:909px;
height:193px;
top:30px;
left:26px;
position:absolute;
}
.banner .wording{
position:absolute;
z-index:2;
top:65px;
left:40px;
}
.shared{
 background:url(../images/bg/bg-shared.jpg) no-repeat;
}
.vps{
 background:url(../images/bg/bg-vps.jpg) no-repeat;
}
.domain{
 background:url(../images/bg/bg-domain.jpg) no-repeat;
}
.banner-vps{
	position:absolute;
	width:257px;
	height:192px;
	top:30px;
	left:26px;
	background:url(../images/bg/banner-vps.gif) no-repeat;
}

.banner-shared{
	position:absolute;
	width:257px;
	height:192px;
	top:30px;
	left:285px;
	background:url(../images/bg/banner-shared.gif) no-repeat;
}

.banner-domain{
	position:absolute;
	width:389px;
	height:192px;
	top:30px;
	left:545px;
	background:url(../images/bg/banner-domain.gif) no-repeat;
}

.banner-vps .wording, .banner-shared .wording, .banner-domain .wording{
	padding:8px 10px 10px;
}



.check-domain{
position:absolute;
bottom:30px;
right:40px;
font-size:14px;
color:#666666;
font-weight:bold;
}


.white-rounded{
background:url(../images/bg/white-rounded-bg.gif) no-repeat top left;
padding-left:20px;
padding-right:30px;
}

.block h1{
 position:relative;
}

h1 span.h1icon{
 background:url(../images/bg/h-icon.gif) no-repeat right 0;
 height:17px;
 width:16px;
 padding-left:10px;
 position:absolute;
}

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

.block{
 padding-top:10px;
 padding-bottom:10px;
}

#footer{
 height:119px;
 display:block;
 position:relative;
}
#footer-menu{
 padding-top:78px;
 text-align:center;
 color:#333333;
 margin:0 auto;
}
#footer-menu a{
}
#footer-menu a:hover{
 text-decoration:underline;
}
#copyright{
 position:absolute;
 right:0;
}


/*table */
.order table {
 border-collapse: collapse;
 width: 100%;
}
.order-page table {
 border-collapse: collapse;
 width: 100%;
}


.order table th,.addons-table th,.order-page th {
 background: #2387a4; 
 height: 33px;
 font-weight: bold;
 font-size:12px;
 vertical-align:middle;
 color:#FFFFFF;
  text-align:center;
}

.order table th a,.addons-table th a,.order-page th a{
  color:#FFFFFF;
}

.order table th.plan,.addons-table th.plan,.order-page th.plan {
 background: url(../images/bg/table-header.gif) no-repeat;
 padding:0 8px;
}

.order table th.cost,.addons-table th.cost,.order-page th.cost {
 background: url(../images/bg/table-header.gif) no-repeat top right;
}

.order table strong {
 font-weight: bold;
}
.order table td.grey-header{
 padding-left:11px;
}

table .odd td {
 background: #e0f0f4;

}

.order table td{
 padding-top:4px;
 padding-bottom:4px;
 border-bottom: 1px #8ca7af solid;
 vertical-align:middle;
}

.order table td.cost {
 white-space: nowrap;
 /*width: 110px;*/
}


.order-btn {
background:transparent url(../images/bg/order-button.gif) no-repeat scroll 0 0;
float:left;
height:22px;
margin-right:4px;
overflow:hidden;
text-indent:-9999px;
width:62px;
}

.contact-block{
 position:absolute;
 width:183px;
 height:100px;
 right:0;
 top:10px;
 background:url(../images/bg/line-contact.gif) no-repeat 0 20px;
 text-align:right;
}

.price{
 text-align:center;
}

.button-silver{
 font-size:12px;

 position:relative;
  background:url(../images/bg/button.gif) no-repeat left top; 

 padding:5px 0 5px 25px;
}
.button-silver .out{
 background:url(../images/bg/button.gif) no-repeat right top;
 padding:5px 0px 5px 10px;
 height:25px;
 position:absolute;
 right:-10px;
 top:0;
 
}

.button-silver .in{

 position:absolute;
 left:0;
 top:0;
}

.news-img-left:hover{
 text-decoration:none;
}
.zoom{
 background:url(../images/bg/zoom.gif) no-repeat left;
 padding-left: 18px;
}
.news-img-left{
 padding:0 10px 10px 0; float:left; text-align:center;
}

.thumb img{
 border:1px solid #DDDDDD;
 padding:2px;
}

#included ul li, #twitter-update ul li{
 padding-bottom:8px;
 margin-left:15px;
}

.side-nav ul li{
 border-bottom:1px solid #d0d0d0;
 list-style:none;
 margin-left:0px;
 padding:5px 5px 5px 23px;

 background:url(../images/bg/bullet-blue-t.gif) no-repeat 3px 8px;
}
.ie7 .side-nav ul li{
 display:inline-block;
}
.side-nav ul li a{
 display:block;
 font-weight:bold;
}
.side-nav ul li.active-trail a,
.side-nav ul li.hover a,
.side-nav ul li:hover a{
 color:#FFFFFF;
 text-decoration:none;
}

.side-nav ul.menu li:hover,
.side-nav ul.menu li.hover,
.side-nav ul.menu li.active-trail{
 background:#2487a6 url(../images/bg/bullet-blue-t.gif) no-repeat 3px -16px
 
}

table.vertical-top td{
vertical-align:top;
}
table.facilities td{
padding:10px;
border-bottom:none;
}
table.facilities td h4{
background:#F0F0F0; 
padding:5px;

display:block;
}
table.facilities td h4 div{
width:100%;
background-image:url(../images/bg/curtain-img.gif);
background-position: right;
background-repeat: no-repeat;

}
.facilities td h4 div:hover, .facilities td h4 div.hover{
 cursor:pointer;
}


table.facilities td p, table.facilities td h4{
font-size:11px;
}
table.facilities td p{
padding:0 5px;
}


.payment table td{
padding:5px;
}

.ol-pad-8 li{
 padding-bottom:8px;
}

#facilities .group-header{
border-bottom:#999999 solid 1px; 
text-align:right; 
margin-bottom:10px; 
position:relative;
}

#twitter-update h2{
background:url(../images/bg/twitter-icon.gif) no-repeat 155px 2px;
}

div.messages {
  background: #FFFCE3;
  border: 2px solid #EED300;
  color: #C28E00;
  font-weight: bold;
  font-size: 1.166em;
  margin: 20px 0pt;
  padding: 10px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
}

div.messages ul {
  list-style-position: inside;
}

div.messages em {
  color: #656C9B;
}

div.error {
  background-color: #FFF2F2;
  border-color: #FF0000;
  color: #B20000;
}

label.error{
  color:#FF0000;
  margin-left:10px;
}

#chat-hover{
	position:absolute;	
	border:#b4c4cd medium solid;	
	top:100%;;
	left:-40px;
	padding:10px;		
	width:250px;
	background-color:#f0f6f6;
	color:#333333;
	display:none;
}
#chat-hover h5{
	margin-bottom:5px;
	font-size:11px;
}
#chat-hover td{
	vertical-align:middle;
}
#chat-hover table td{
	padding-right:15px;
}
#secondary-menu #chat-hover a{
 background:none;
}

.news h2{
 font-size:16px;
 border-bottom:#666666 dotted 1px;
 margin-bottom:0;
}

.news .news-list{
 margin-top:20px;
 margin-bottom:30px; 
}

.news .news-list p{
 padding-top:2px;
}

.footer-banner{
 position:absolute;
 bottom:3px;
 right:50px;
}
.chat-live{
position: absolute; width: 240px; top: 38px; right: 11px;
}