/* Copyright 2010 Google, Inc. All Rights Reserved */

@import url(//www.google.com/css/modules/buttons/g-button-woodstock.css);
@import url(//fonts.googleapis.com/css?family=Droid+Sans);

html {
  color: #333;
}
* html .g-doc-1024 {
  width: 950px;
}
h1, h2, h3 {
  font-family: 'Droid Sans', arial, sans-serif;
  color: #676767;
}
h1, h2 {
  padding-bottom: 5px;
  margin-bottom: .6em;
}
h1, h2, p.sub-headline {
  letter-spacing: -0.04em;
  font-weight: normal;
  margin-top: .5em;
}
h1 {
  font-size: 1.92em;
  color: #676767;
}
h2 {
  font-size: 1.3em;
}
.sub-headline {
  font-size: 1.46em;
  color: #444;
}
h2.first-level {
  font-size: 1.92em;
  padding-bottom: 0;
  margin-top: .8em;
  margin-bottom: .4em;
  line-height: 1.36em;
}
p {
  line-height: 1.4em;
}
a {
  color: #1f7fc4;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}
#breadcrumbs {
  margin: -0.7em 0 1.1em;
}
.heading-t1, .heading-t1p {
  color: #1ab123;
}
.heading-t1 {
  border-bottom: 1px solid #bee9c1;
}
.heading-t2, .heading-t2p {
  color: #fe9f04;
}
.heading-t2 {
  border-bottom: 1px solid #ffe2b3;
}
.heading-t3, heading-t3p {
  color: #ff330b;
}
.heading-t3 {
  border-bottom: 1px solid #ffc1b5;
}
.footer-t1 {
  border-top: 1px solid #bee9c1;
  padding-top: 0.2em;
}
.footer-t2 {
  border-top: 1px solid #ffe2b3;
  padding-top: 0.2em;
}
.footer-t3 {
  border-top: 1px solid #ffc1b5;
  padding-top: 0.2em;
}
a.lrn {
  font-family: 'Droid Sans', arial, sans-serif;
}
.links {
  list-style: none;
  margin: 0;
}
.links a {
  text-transform: uppercase;
  font-size:.8em;
  font-weight: bold;
}
.links a span {
  color: #808080;
  font-size: 1.4em;
}
.cta-67-33 {
  margin: 10px 0 0 30px;
}

/* grid/gutters */
.col-1-2 {
  margin-right: 15px;
}
.col-2-2 {
  margin-left: 15px;
}
.col-cta {
  text-align: right;
}

/* header */
.header {
  margin-bottom:.99em;
  color: #575656;
}
.header h1 {
  margin: -0.15em 0 0 .3em;
}
.header img {
  float:left;
}
.header ul {
  font-family: 'Droid Sans', arial, sans-serif;
}
.header ul li {
  margin-left: 22px;
  font-weight: bold;
}
.header ul li a {
  color: #575656;
  font-weight: normal;
}
.header ul li a:hover {
  color: #676767;
}
.header ul#global-nav-extra li a {
  background: transparent url('/ads/images/arrow-more.png') no-repeat right center;
  padding-right: 12px;
}
#global-nav-extra {
  border-left: 1px solid #ccc;
  margin-left: 22px;
}

/* main/content */

.basic {
  border-top: 1px solid #eee
}
.testimonial {
  -moz-border-radius: 5px;
  border-radius: 5px;
  background-color: #e3e3e3;
  height: 250px;
  width: 450px;
}
.testimonial span.read {
  background: url("/images/icons/feature/star_video-r16.png") no-repeat scroll right top transparent;
  color: #1f7fc4;
  float: right;
  font-weight: bold;
  margin-right: 8px;
  padding-right: 20px;
  padding-top: 1px;
  text-transform: uppercase;
}
.testimonial span.attr {
  padding-left:.5em
}
.testimonial span {
  font-size: .9em
}

.success-story p {
  margin-bottom: .2em;
  margin-left: 120px;
}
.one-unit {
  padding-bottom: 30px;
}

/* menu */
#menu {
  background: url(/ads/images/bg_menu.png) repeat-x left -90px;
  height: 50px;
  margin-bottom: .5em;
}
#menu h1 {
  float:left;
  font-size: 1.53em;
  margin: 0;
  padding: 11px 0 0;
}
#menu h1 a {
  color: inherit;
  text-decoration: none;
}
#menu ul {
  float: right;
  margin: 0;
  padding: 0;
  list-style: none;
}
#menu ul li {
  float: left;
  margin: 0 0 0 15px;
}
#menu ul li a,
#menu ul li strong {
  background: url(/ads/images/bg_menu.png) no-repeat left -30px;
  display: block;
}
* html #menu ul li a,
* html #menu ul li strong {
  float: left;
  cursor: pointer;
}
#menu ul li a {
  background-position: right -30px;
  font: 14px 'Droid Sans', arial, sans-serif;
  color: #575656;
  padding-right: 15px;
  margin: 9px 0;
  text-decoration: none;
  outline: none;
}
#menu ul li strong {
  height: 20px;
  line-height: 20px;
  padding: 5px 0 5px 15px;
  white-space: nowrap;
}
#menu ul li a:hover {
  background-position: right -60px;
}
#menu ul li a:hover strong {
  background-position: left -60px;
}
#menu ul li a:active,
#menu ul li a.menu-selected {
  background-position: right top;
}
#menu ul li a:active strong,
#menu ul li a.menu-selected strong {
  background-position: left top;
}

/* sub-menu */
.sub-menu {
  list-style: none;
  border-bottom: 2px solid #DEDEDE;
  overflow: hidden;
  padding: 10px 1em 0;
  margin: 1em 0;
  font-size: 1.1em;
}
* html .sub-menu {
  height: 1%;
}
.sub-menu li {
  float: left;
  margin: 0 1em 0 0;
}
.sub-menu li a {
  display: block;
  float: left;
  height: 34px;
}
.sub-menu li span {
  display: block;
  float: left;
  padding: .5em 1em;
  background: #dedede;
  font-weight: bold;
  height: 20px;
  line-height: 20px;
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  -o-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
}
.sub-menu li a span {
  border: 2px solid #ddd;
  background: transparent;
  border-bottom: none;
  font-weight: normal;
}
.sub-menu li a:hover span {
  background: #e9e9e9;
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
  -o-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
}

/* global-footer */
.global-footer {
  border-top: 1px solid #eee;
  margin-top: 17px;
  padding-top: 20px;
}
.global-footer div div {
  width: 145px;
  margin-right: 20px;
  float: left;
}
.global-footer h3 {
  font-size: 1em;
  margin-bottom: .2em;
}
.global-footer ul {
  list-style: none outside none;
  margin-left: 0;
  font-size: .93em;
}
.global-footer ul li {
  margin-bottom: .2em;
}

/* hero-box */
.hero-box .carousel-box-nav {
  margin-top: -48px;
  width: 20%;
}
.hero-box .carousel-box-slides {
  height: 400px;
}
.hero-box-no-heading {
  margin-top: 7px;
}
.hero-box-no-heading .carousel-box-nav {
  float: none;
  margin-top: -10px;
  width: 100%;
}

/* hero-box > hero-testimonial */
.hero-testimonial {
  width: 460px;
  background-color:#e3e3e3;
  -moz-border-radius: 5px;
  border-radius: 5px;
  position: relative;
}
.hero-testimonial img {
  display: block;
  cursor: pointer;
}
.hero-testimonial-author {
  height: 15px;
  float: left;
  margin: 4px 0 0 7px;
  font-size: 0.85em;
  color: #666;
}
.hero-testimonial-readmore {
  background: url(/ads/images/ui_testimonial_readmore.png) no-repeat right -48px;
  cursor: pointer;
  margin: 5px 7px 0 0;
  padding-right: 24px;
  float: right;
  font-weight: bold;
  font-size: .8em;
  color:#1f7fc4;
  text-transform: uppercase;
  height: 16px;
  line-height: 16px;
  overflow: hidden;
}
.hero-testimonial-readmore:hover,
.hero-testimonial-reading {
  background-position: right -32px;
}
.hero-testimonial blockquote {
  display: none;
  bottom: 10px;
  margin: 0;
  padding: 0;
  position: absolute;
  right: -5px;
  width: 280px;
}
.hero-testimonial blockquote h3 {
  background: url(/ads/images/bg_testimonial.png) no-repeat left top;
  padding: 15px 15px 10px;
  margin: 0;
}
.hero-testimonial blockquote p {
  background: url(/ads/images/bg_testimonial.png) no-repeat left bottom;
  padding: 0 15px 35px;
  margin: 0;
}
.hero-testimonial-close {
  display: block;
  cursor: pointer;
  text-indent: -999px;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 12px;
  height: 12px;
  background: url(/ads/images/btn_close.gif) no-repeat center center;
  overflow: hidden;
}
* html .hero-testimonial blockquote h3,
* html .hero-testimonial blockquote p {
  background-image: url(/ads/images/bg_testimonial.index.png);
}
.hero-testimonial h2 {
  cursor: pointer;
  text-indent: -999px;
  width: 460px;
  height: 195px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-repeat: no-repeat;
}
.hero-testimonial h2 a {
  display: block;
  width: 100%;
  height: 100%;
}
#hero-bizsol .hero-testimonial,
#hero-ap .hero-testimonial {
  height: 220px;
}
#hero-bizsol .hero-testimonial h2,
#hero-ap .hero-testimonial h2 {
  height: 195px;
}
#hero-new-gs .hero-testimonial,
#hero-new-fc .hero-testimonial,
#hero-new-br .hero-testimonial {
  height: 252px;
}
#hero-new-gs .hero-testimonial h2,
#hero-new-fc .hero-testimonial h2,
#hero-new-br .hero-testimonial h2 {
  height: 227px;
}
#hero-bizsol .hero-testimonial h2 {background-image: url(/ads/images/hero-pics/hero-bizsol.jpg);}
#hero-ap .hero-testimonial h2 {background-image: url(/ads/images/hero-pics/hero-ap.jpg);}
#hero-new-gs .hero-testimonial h2 {background-image: url(/ads/images/hero-pics/hero-new-gs.jpg);}
#hero-new-fc .hero-testimonial h2 {background-image: url(/ads/images/hero-pics/hero-new-fc.jpg);}
#hero-new-br .hero-testimonial h2 {background-image: url(/ads/images/hero-pics/hero-new-br.jpg);}
#hero-bizsol-tags h2 {background-position: left top;}
#hero-bizsol-adwords h2 {background-position: left -195px;}
#hero-bizsol-gdn h2 {background-position: left -390px;}
#hero-bizsol-adsense h2 {background-position: left -585px;}
#hero-ap-adwords h2 {background-position: left top;}
#hero-ap-adsense h2 {background-position: left -195px;}
#hero-new-gs-tag h2 {background-position: left top;}
#hero-new-gs-adwords h2 {background-position: left -227px;}
#hero-new-fc-adwords-1 h2 {background-position: left top;}
#hero-new-fc-adwords-2 h2 {background-position: left -227px;}
#hero-new-br-analytics h2 {background-position: left top;}
#hero-new-br-wso h2 {background-position: left -227px;}
#hero-new-br-wmc h2 {background-position: left -454px;}
/* TODO(zackyma) remove these 3 following lines */
#hero-new-br-analytics-alt h2 {background-position: left top;}
#hero-new-br-wso-alt h2 {background-position: left -227px;}
#hero-new-br-wmc-alt h2 {background-position: left -454px;}

#hero-new-fc .hero-product h2.first-level {
  margin-left: 0;
}
#hero-new-br .carousel-box-slides {
  height: 440px;
}

/* hero-box > product */
.hero-product {
  margin: 1em 0;
}
.hero-product img {
  float: left;
}
.hero-product h2.heading-t1 a {
  color: #1AB123;
}
.hero-product h2.first-level {
  border-bottom: none;
  margin: 0 0 .2em 57px;
  line-height: 42px;;
  height: 42px;
}
.hero-product p {
  margin-bottom: .5em;
  color: #666;
}
.hero-product p strong {
  color: #333;
}

/* hero-box > cta */
.hero-cta .g-unit .links {
  padding-left: 1em;
}
.hero-cta .links li {
  margin-bottom: 0.2em;
  line-height: 1em;
}

/* carousel-box */
.carousel-box-nav {
  float: right;
  height: 30px;
  margin-top: -38px;
  position: relative;
  width: 50%;
}
.carousel-box-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
}
.carousel-box-nav li {
  float: left;
  margin: 0;
}
.carousel-box-nav-tabs {
  height: 10px;
  right: 45px;
  top: 10px;
}
.carousel-box-nav-paging {
  height: 16px;
  right: 0;
  top: 5px;
  margin-left: 10px;
}
.carousel-box-nav-tabs li {
  height: 9px;
  margin-left: 5px;
  width: 9px;
}
.carousel-box-nav-paging li {
  height: 16px;
  margin-left: 3px;
  width: 16px;
}
.carousel-box-nav li a {
  background-image: url(/ads/images/carousel_nav.gif);
  background-repeat: no-repeat;
  display: block;
  height: 100%;
  outline: none;
  overflow: hidden;
  text-indent: -100px;
  width: 100%;
}
.carousel-box-nav-tabs a {
  background-position: -41px top;
}
.carousel-box-nav-tab-selected a {
  background-position: -32px top;
}
.carousel-box-nav-previous a {
  background-position: left top;
}
.carousel-box-nav-next a {
  background-position: -16px top;
}
.carousel-box-slides {
  height: 220px;
  position: relative;
}
.carousel-box-slide {
  background-color: #fff;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

/* success-box */
.success-box-snippet {
  margin-bottom: 1em;
  overflow: hidden;
}
* html .success-box-snippet {
  clear: both;
}
.success-box-snippet blockquote {
  margin: 0 0 0 120px;
}
.success-box-snippet p,
.success-box-snippet cite {
  margin: 0 0 0.2em 0;
}
.success-box-snippet cite {
  display: block;
  font-style: normal;
}
.success-box-snippet img {
  float: left;
}
.success-box-baby h2 {
  margin-top: 0;
  border: none;
}
.success-box-baby .carousel-box-slides {
  height: 140px;
}
.success-box-titan .success-box-snippet {
  float: left;
  width: 46%;
  margin: 0 2%;
}
* html .success-box-titan .success-box-snippet {
  clear: none;
  width: 42%;
}
.success-box-titan .carousel-box-slides {
  height: 110px;
  margin-top: 20px;
}
.success-box-tall .carousel-box-slides {
  height: 300px;
}
.success-thumb {
  float: left;
  width: 105px;
  height: 90px;
  text-indent: -999px;
  overflow: hidden;
  display: block;
  background: url(/ads/success/images/thumb/sprite.jpg) no-repeat left top;
}
#success-box-adwords-happyhound .success-thumb {background-position: left top;}
#success-box-adwords-firstcrush .success-thumb {background-position: left -90px;}
#success-box-adwords-mobiledemand .success-thumb {background-position: left -180px;}
#success-box-adwords-eseats .success-thumb,
#success-box-analytics-eseats .success-thumb {background-position: left -270px;}
#success-box-adwords-bankrate .success-thumb {background-position: left -360px;}
#success-box-adwords-onetruemedia .success-thumb {background-position: left -450px;}
#success-box-adwords-twiddy .success-thumb {background-position: left -540px;}
#success-box-adsense-automotiveforums .success-thumb {background-position: left -630px;}
#success-box-adsense-apartmentratings .success-thumb {background-position: left -720px;}
#success-box-gdn-justanswer .success-thumb {background-position: left -810px;}
#success-box-tv-br111 .success-thumb {background-position: left -900px;}
#success-box-tv-fragrancenet .success-thumb {background-position: left -990px;}
#success-box-analytics-carolina .success-thumb {background-position: left -1080px;}
#success-box-analytics-iycg .success-thumb {background-position: left -1170px;}
#success-box-adwords-swapalease .success-thumb,
#success-box-analytics-swapalease .success-thumb {background-position: left -1260px;}
#success-box-analytics-helmettown .success-thumb {background-position: left -1350px;}
#success-box-websiteoptimizer-doba .success-thumb {background-position: left -1440px;}
#success-box-websiteoptimizer-jigsaw .success-thumb {background-position: left -1530px;}
#success-box-websiteoptimizer-tbc .success-thumb {background-position: left -1620px;}

/* step-box */
.step-box {
  background-color: #f4f4f4;
  overflow: hidden;
  position: relative;
  margin: 1em 0 2em;
  padding: 0;
  width: 100%;
  font-size: 13px;
  border: 1px solid #dedede;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  -o-border-radius: 5px;
  -webkit-box-shadow: 0 1px 6px #afafaf;
  -moz-box-shadow: 0 1px 6px #afafaf;
  -o-box-shadow: 0 1px 6px #afafaf;
  box-shadow: 0 1px 6px #afafaf;

}
.step-box .g-tabs {
  float: left;
  height: 100%;
  width: 220px;
  border-radius: 5px 0 0 5px;
  -moz-border-radius: 5px 0 0 5px;
  -webkit-border-radius: 5px 0 0 5px;
  -o-border-radius: 5px 0 0 5px;
}
.step-box .g-tabs ul {
  list-style: none;
  margin: 10px 0;
  padding: 0;
}
.step-box .g-tab {
  margin: 0;
}
.step-box .g-tab a {
  display: block;
  padding: 1.2em 10px;
  cursor: pointer;
  *cursor: hand;
  height: 1%;
}
.step-box .g-tab a:hover {
  background: #e9e9e9;
}
.step-box .g-tab-selected a {
  color: #333;
  font-weight: bold;
  text-decoration: none;
  cursor: default;
  background: #e3e3e3;
  border-top: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
}
.step-box .g-tab-contents {
  float: right;
  width: 729px;
  background: #fff;
  border-left: 1px solid #dedede;
  position: relative;
  height: 100%;
  border-radius: 0 5px 5px 0;
  -moz-border-radius: 0 5px 5px 0;
  -webkit-border-radius: 0 5px 5px 0;
  -o-border-radius: 0 5px 5px 0;
}
* html .step-box .g-tab-contents {
  overflow: hidden;
}
.step-box .g-tab-content-hidden {
  display: none;
}
.step-box .g-tab-content {
  padding: 20px 20px 20px 40px;
}
.step-content {
  position: relative;
  overflow: hidden;
}
.step-duration {
  background: #ffc url(/images/icons/feature/clock-y32.png) no-repeat 5px center;
  border: 1px solid #ddd;
  border-width: 0 0 1px 1px;
  border-radius: 0 5px 0 10px;
  -moz-border-radius: 0 5px 0 10px;
  -webkit-border-radius: 0 5px 0 10px;
  -o-border-radius: 0 5px 0 10px;
  font-weight: bold;
  height: 32px;
  line-height: 1.2em;
  margin: 0;
  padding: 5px 5px 5px 45px;
  position: absolute;
  right: 0;
  top: 0;
  width: 80px;
}
.step-duration span {
  display: block;
  font-size: 0.8em;
  font-weight: normal;
}
.step-content h2 {
  margin-bottom: 1em;
  margin-top: 0;
}
.step-content img {
  border: 1px solid #e0e0e0;
  float: right;
  padding: 2px;
  margin: 0 0 2em 2em;
}
.step-content h3 {
  border-top: 1px solid #ddd;
  clear: right;
  padding-top: 10px;
}

#step-box-tags .g-tab-content {
  height: 510px;
}
#step-box-adwords .g-tab-content {
  height: 650px;
}

/* get-started > faq */
.faq-question {
  font: 13px arial, sans-serif;
  margin: 0;
  padding: 5px;
  outline: none;
}
.faq-question a {
  background-repeat: no-repeat;
  background-position: left top;
  padding-left: 25px;
  outline: none;
}
.faq-question-expand a {
  background-image: url(/ads/images/twisties_minus_grey.gif);
}
.faq-question-collapse a {
  background-image: url(/ads/images/twisties_plus_grey.gif);
}
.faq-answer {
  padding-left: 30px;
}

/* step-by-step */
.step-by-step-button {
  margin: 1em 0;
  text-align: center;
}

/* find-customers */
.find-customers-hero {
  margin-top: 20px;
}
.find-customers-hero .first-level {
  margin-top: 15px;
}
.product-list h3 {
  font-weight: normal;
}
.product-list img {
  margin-right: 15px;
  float:left;
}
.product-list span {
  float:left;
  padding-top:9px;
}
.product-list span.linewrap {
  padding-top:3px
}
.product-list p {
  clear:both;
  padding-top: 20px;
}

.product-title p {
  color: #808080;
  font-size: 1.2em;
  font-family: 'Droid Sans', arial, sans-serif;
  letter-spacing: -0.04em;
}

/* boost-results */
.boost-results .heading-blurb .sub-headline {
  margin-top: 0;
  margin-bottom: 0;
}
.boost-results .hero-box-no-heading {
  margin-top: -1.5em;
}

/* dialog-box popup window (styles for goog.ui.Dialog) */
.dialog-box-bg {
  position: absolute;
  background-color: #666;
  top: 0;
  left: 0;
}

.dialog-box {
  position: absolute;
  background-color: #fff;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: 0 3px 10px #CCCCCC;
  -webkit-box-shadow: 0 3px 10px #CCC;
  border: 1px solid #DCDCDC;
  width: 670px;
  color: #000;
  outline: none;
}
.dialog-box-title {
  position: relative;
  background-color: #F0F0F0;
  height: 45px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 10px;
  margin: 5px;
  cursor: pointer;
  cursor: hand;
}
.dialog-box-title-text {
  color: #7F7F7F;
  display: block;
  font: 1.3em "Droid Sans", arial, sans-serif;
  padding: 0.6em 1em;
}
.dialog-box-title-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 13px;
  height: 13px;
  background: url(/services/images/finder_nav.png) no-repeat right top;
  text-indent: -999px;
  overflow: hidden;
  margin: 0;
  cursor: pointer;
}
.dialog-box-content {
  margin: 15px;
}
.dialog-box-buttons {
  display: none;
}