#main_content { padding-top: 21px; }
#hb_categories {
  float: left;
  margin: 0;
}
#hb_categories .where_h {
  background: url(/images/hb_home_sprites.png) no-repeat 0px -678px;
  height: 36px;
  width: 274px;
  margin-bottom: 15px;
}
#hb_categories ul {
  float: left;
  font-size: 150%;
  font-weight: normal;
  list-style: none;
  margin: 0px;
  padding: 0px;
  text-shadow: 0px 1px 0px #FFF;
}
#hb_categories li {
  display: block;
  float: left;
  margin: 0px 0px 8px 0px;
  width: 197px;
}
#hb_categories li a {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  background: #F8F8F8;
  border-radius: 3px;
  color: #777;
  margin: 1px 0px;
  padding: 1px 7px;
  text-decoration: none;

}
#hb_categories li a:hover, #hb_categories li a:focus {
  background: #FEC707;
  color: #111;
  text-shadow: 0px 1px 0px #DDD;
}
#hb_categories .cat_color1:hover, #hb_categories .cat_color1:focus {
  background: #ff8a00;
}
#hb_categories .cat_color2:hover, #hb_categories .cat_color2:focus {
  background: #d72323;
  color:#FFF;
  text-shadow: 0px 1px 0px #222;
}
#hb_categories .cat_color3:hover, #hb_categories .cat_color3:focus {
  background: #46aaff;
}
#hb_categories .cat_color4:hover, #hb_categories .cat_color4:focus {
  background: #FEC707;
}
#hb_categories .cat_color5:hover, #hb_categories .cat_color5:focus {
  background: #FEC707;
}
#hb_categories .cat_color6:hover, #hb_categories .cat_color6:focus {
  background: #91e49b;
}
#hb_categories .cat_color7:hover, #hb_categories .cat_color7:focus {
  background: #222;
  color: #19ff34;
  text-shadow: 0px 1px 0px #222;
}
#hb_mid_content {
  background: url(/images/create_deploy_enjoy_img.png) no-repeat 0px 0px;
  float: left;
  height: 154px;
  margin: 0px 0px 16px 0px;
  width: 875px;
}
#hb_signup {
  background: url(/images/signup_bottom_shadow.png) no-repeat center bottom;
  color: #444;
  display: block;
  float: left;
  margin: 17px 0px 00px 0px;
  padding: 0px 0px 60px 0px;
  text-align: center;
  width: 815px;
}
#hb_signup h2 {
  background: url(/images/signup_btn_bk.png) no-repeat center 0px;
  height: 55px;
  font-size:28px;
  margin: 0px;
  padding: 10px 0px 0px 0px;
}
#hb_signup h2 img {
  float:left;
  height: 33px;
  margin: 0px 27px 0px 220px;
  padding:0px;
}
#hb_signup h2 a {
  background: url(/images/signup_btn.png) no-repeat 0px 0px;
  height: 35px;
  float:left;
  margin:0px;
  padding:0px;
  width: 158px;
}
#hb_signup a:hover, #hb_signup a:focus {
  background: url(/images/signup_btn.png) no-repeat 0px -72px;
}
#hb_signup a:active {
  background: url(/images/signup_btn.png) no-repeat 0px -36px;
}
#hb_signup h3 {
  margin: 05px 12px 0px 0px;
  padding:0px;
}
#hb_signup h3 img {
  float:left;
  margin: 0px -12px 10px 305px;
  padding:0px;
}
#hb_signup h3 a {
  background: url(/images/signup_contact_btn.png) no-repeat 0px 0px;
  display:inline-block;
  height: 27px;
  float:left;
  margin:0px;
  padding:0px;
  width: 105px;
}
#hb_signup h3 a:hover, #hb_signup h3 a:focus {
  background: url(/images/signup_contact_btn.png) no-repeat 0px -25px;
}
#hb_bottom_content {
  float: left;
  margin: 20px 0px 10px 42px;
}
.hb_clients, .hb_press {
  float: left;
  width: 396px;
}
#hb_bottom_content h3 {
  float:left;
  margin: 0px 0px 15px 0px;
  padding: 0px;
  width:120px;

}
#hb_bottom_content a {
  float: left;
  height: 60px;
}
#hb_bottom_content span {
  float: right;
  margin: 3px 120px 0px 0px;
}
#hb_bottom_content span a {
  border-bottom: 1px dotted #BBB;
  color: #AAA;
  display:block;
  font-size: 12px;
  height:15px;
  text-decoration: none;
  width:auto;
}
#hb_bottom_content span a:hover, #hb_bottom_content span a:focus {
  color: #555;
}
.client_img1 {
  background: url(/images/client_siggraph.png) 0px 60px;
  width: 97px;
}
.client_img1:hover,.client_img1:focus {
  background: url(/images/client_siggraph.png) 0px 0px;
}
.client_img2 {
	background: url(/images/client_mfa.png) 0px 60px;
	width: 96px;
}
.client_img2:hover, .client_img2:focus {
	background: url(/images/client_mfa.png) 0px 0px;
}
.client_img3 {
	background: url(/images/client_princeton.png) 0px 60px;
	width: 184px;
}
.client_img3:hover, .client_img3:focus {
	background: url(/images/client_princeton.png) 0px 0px;
}
.press_img1 {
	background: url(/images/press_bw.png) 0px 60px;
	width: 118px;
}
.press_img1:hover, .press_img1:focus {
	background: url(/images/press_bw.png) 0px 0px;
}
.press_img2 {
	background: url(/images/press_forbes.png) 0px 60px;
	width: 108px;
}
.press_img2:hover, .press_img2:focus {
	background: url(/images/press_forbes.png) 0px 0px;
}
.press_img3 {
	background: url(/images/press_tc.png) 0px 60px;
	width: 150px;
}
.press_img3:hover, .press_img3:focus {
	background: url(/images/press_tc.png) 0px 0px;
}
h2 {
	color: #646967;
	font-size: 22px;
	font-weight: normal;
	margin: 0 0 10px 0;
}
h3 {
	color: #646967;
	font-size: 18px;
	font-weight: normal;
	margin: 0 0 10px 0;
}
h4 {
	color: #646967;
	font-size: 16px;
	font-weight: normal;
	margin: 0 0 10px 0;
}
h5 {
	border-bottom: 1px solid #82bb9f;
	color: #646967;
	font-size: 17px;
	font-weight: normal;
	margin: 0;
	padding-bottom: 6px;
	text-align: center;
}
h6 {
	font-size: 14px;
	font-weight: normal;
	margin: 5px 0;
}
img, img a {
	border: 0;
}

#welcome {
  background: url(/images/hb_home_sprites.png) no-repeat 0px -550px;
  height: 123px;
  width: 781px;
  margin-top: 5px;
}

#welcome_h {
  background: url(/images/hb_home_sprites.png) no-repeat 0 -88px;
  height: 28px;
  width: 312px;
  margin-top: 5px;
}

/* icons */
.i { display: inline-block; float: left; margin-right: 11px; }

.flag {
  background: url(/images/hb_home_sprites.png) 0px -888px;
  height: 46px;
  width: 41px;
}

.map {
  background: url(/images/hb_home_sprites.png) 0px -939px;
  height: 46px;
  width: 47px;
}

.star {
  background: url(/images/hb_home_sprites.png) 10px -990px;
  height: 46px;
  width: 47px;
}

.attract {
  background: url(/images/hb_home_sprites.png) 0px -415px;
  height: 46px;
  width: 47px;
}

.engage {
  background: url(/images/hb_home_sprites.png) 0px -365px;
  height: 45px;
  width: 76px;
}

.badge {
  background: url(/images/hb_home_sprites.png) 0px -305px;
  height: 55px;
  width: 56px;
}

/* @group What */
#what {
  background: url(/images/hb_home_sprites.png) no-repeat 0px -719px;
  height: 120px;
  padding-top: 27px;
  margin: 25px 0 0px 0;
  width: 795px;
}

  #what ul, #why ul { list-style: none; }

  #what ul {
    margin: 20px 0 0 0;
    padding-left: 20px;
  }

    #what li {
      display: block;
      float: left;
      width: 230px;
    }

    #what li.mid { margin: 0 36px; }

    #what h3 {
      float: left;
      margin: 0 0 3px 0;
      padding: 0 0 5px 0;
    }

    #what li p {
      clear: left;
      color: #666;
      line-height: 160%;
      margin: 0 0 5px 0;
    }
  #what li div { display: inline-block; width: 170px; }
/* @end */

.gs { margin-right: 38px; text-shadow: 1px 1px 0 white; }
  .gs span { font-size: 131%; }

  .gs a:link, .gs a:active, .gs a:visited { color: #777; }
  .gs a:hover {
    background-color: #fffdec;
    border-bottom: 1px solid #ffefb2;
    color: #333;
  }


/* @group Why */
#why .why_h { background: url(/images/hb_home_sprites.png) no-repeat 0px -264px; height: 35px; }
#why ul {
  padding: 0;
  width: 795px;
  margin: 5px 0 0 10px;
}

#why li {
  float: left;
  width: 230px;
}

#why li p {
  color: #777;
  font-size: 116%;
  margin: 0;
}

#why h3 {
  margin-bottom: 2px;
  padding: 0 0 4px 0;
}

#why li div { float: left; }
#why .arrow {
  background: url(/images/hb_home_sprites.png) no-repeat 0 0;
  height: 80px;
  width: 26px !important;
  margin: 0 22px;
}

.col_a, .col_b, .col_c { margin-top: 15px; }

#why .col_a { width: 185px; }
#why .col_b { margin-left: 7px; margin-right: 8px; width: 193px; }
#why .col_c { width: 252px; }

#try {
  background: url(/images/hb_home_sprites.png) no-repeat 0px -462px;
  height: 60px;
  width: 399px;
  margin: 10px auto;
}

#try a {
  margin: 8px 9px 0px 0px;
  width: 150px;
}

#pricing_link {
  color:#666;
  font-size: 116%;
  margin: 00px auto;
  padding:0 13px 0 0;
  text-align: right;
  width: 399px;
}
#pricing_link a {
  border-bottom: 1px dotted #aaa;
  color:#666;
}
#pricing_link a:hover {
    background-color: #fffdec;
    border-bottom: 1px solid #ffefb2;
    color: #333;
  }


  /* TODO(fabian@scvngr.com): replace buttons styles with this */
html .button {
  color: #555;
  display: block;
  padding: 10px;
  font-size: 125%;
  font-weight: bold;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border: 1px solid #b5b5b5;
  box-shadow: inset 0px 1px 0px rgba(255,255,255,0.6);
  -webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.6);
  -moz-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.6);
  background: #ace344;
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.0, #87cf2e),
    color-stop(0.55, #bceb4d)
  );
  background:
  -moz-linear-gradient(
      center bottom,
      #87cf2e 0%,
      #bceb4d 55%
  );
  background: filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#87cf2e', endColorstr='#bceb4d');
  text-align: center;
  text-shadow: 0px 1px 0 #ecf15e;
}

html .button:hover {
  background: #686868;
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.10, #3f3f3f),
    color-stop(0.75, #686868)
  );
  background: -moz-linear-gradient(
    center bottom,
    #3f3f3f 10%,
    #686868 75%
  );
  background: filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#686868', endColorstr='#3f3f3f');
  color: #FFF;
  box-shadow: inset 0px 1px 0px rgba(255,255,255,0.2);
  -webkit-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.2);
  -moz-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.2);
  border: 1px solid #292929;
  text-shadow: 0px 1px 0 #333;
}

html .button:active {
  background: #686868;
  background: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.10, #686868),
    color-stop(0.75, #3f3f3f)
  );
  background: -moz-linear-gradient(
    center bottom,
    #686868 10%,
    #3f3f3f 75%
  );
  background: filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#3f3f3f', endColorstr='#686868');
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  color: #999;
}