/** Copyright 2005 Google Inc. All rights reserved. */

/* the GSearchControl CSS Classes

 * .gsc-control : the primary class of the control

 */

.gsc-control {

  width: 300px;

}

.gsc-control div {

  position: static;

}

/* control inputs

 * .gsc-search-box : the container that hosts the text input area

 * .gsc-input : the text input area

 * .gsc-keeper : the save link below savable results

 */

form.gsc-search-box {

  font-size: 13px;

  margin-top : 0px;

  margin-right : 0px;

  margin-bottom : 4px;

  margin-left : 0px;

  width: 100%;

}

/*

 * This table contains the input element as well as the search button

 * Note that the search button column is fixed width, designed to hold the

 * button div's background image

 */

table.gsc-search-box {

  border-style : none;

  border-width : 0px;

  border-spacing : 0px 0px;

  width : 100%;

  margin-bottom : 2px;

}

table.gsc-search-box td {

  vertical-align : middle;

}

table.gsc-search-box td.gsc-input {

  padding-right : 2px;

}

td.gsc-search-button {

  width : 1%;

}

td.gsc-clear-button {

  width : 14px;

}

/**

 * undo common generic table rules

 * that tend to impact branding

 */

table.gsc-branding td,

table.gsc-branding {

  margin: 0 0 0 0;

  padding: 0 0 0 0;

  border : none;

}

table.gsc-branding {

  border-style : none;

  border-width : 0px;

  border-spacing : 0px 0px;

  width : 100%;

}

.gsc-branding-text {

  color : #676767;

}

td.gsc-branding-text {

  vertical-align : top;

}

td.gsc-branding-text div.gsc-branding-text {

  padding-bottom : 2px;

  text-align : right;

  font-size : 11px;

  margin-right : 2px;

}

div.gsc-branding-youtube td.gsc-branding-text {

  vertical-align : middle;

}

td.gsc-branding-img-noclear {

  width : 51px;

  vertical-align : bottom;

}

td.gsc-branding-img {

  width : 65px;

  vertical-align : bottom;

}

div.gsc-branding-youtube td.gsc-branding-img-noclear {

  width : 55px;

}

div.gsc-branding-youtube td.gsc-branding-img {

  width : 69px;

}

table.gsc-branding-vertical td.gsc-branding-text div.gsc-branding-text {

  margin-right : 0px;

  text-align : center;

}

table.gsc-branding-vertical td.gsc-branding-img-noclear {

  text-align : center;

}

div.gsc-branding-img,

div.gsc-branding-img-noclear,

img.gsc-branding-img,

img.gsc-branding-img-noclear {

  padding-top : 1px;

}

img.gsc-branding-img,

img.gsc-branding-img-noclear {

  margin : 0 0 0 0;

  padding-right : 0;

  padding-left : 0;

  padding-bottom : 0;

  border : none;

  display : inline;

}

a.gsc-branding-clickable {

  cursor : pointer;

}

input.gsc-search-button {

  margin-left : 2px;

}

div.gsc-clear-button {

  display : inline;

  text-align : right;

  margin-left : 4px;

  margin-right : 4px;

  padding-left : 10px;

  background-repeat: no-repeat;

  background-position: center center;

  background-image: url('/uds/css/clear.gif');

  cursor : pointer;

}

/*

 * Given that this is sitting in a variable width tabel cell, the idea is

 * for it to consume the entire cell. The adjacent cell contains the search

 * button and that is a fixed width cell.

 */

input.gsc-input {

  padding-left : 2px;

  border-style : solid;

  border-width : 1px;

  border-color : #BCCDF0;

  width : 99%;

}

.gsc-keeper {

  color: #3366cc;

  text-decoration: underline;

  font-size: 13px;

  cursor: pointer;

  font-weight: normal;

  padding-left: 16px;

  background-repeat: no-repeat;

  background-position: 1px 3px;

  background-image: url('/uds/css/blue_check.gif');

}

/* each section of results has a results header table

 * .gsc-resultsHeader : the header itseld

 * td.twiddleRegionCell : the section that controls twiddleing of the section to expand/collapse

 * td.configLabelCell : the twiddler that controls active configuration of a searcher (used in GlocalSearch

)

 * .gsc-twiddle : the twiddle image, note, this is a div that wraps gsc-title so that standard image

 replacement is feasible

 * .gsc-twiddle-closed : class added to gsc-twiddle when the twiddler is in the closed state

 * .gsc-twiddle-opened : class added to gsc-twiddle when the twiddler is in the opened state

 * .gsc-title : the section's title (e.g., Web Results, etc.)

 * .gsc-stats : contains the result counts

 * .gsc-stats

 */

.gsc-resultsHeader {

  clear: both;

  width: 100%;

  border-bottom: 1px solid #e9e9e9;

  margin-bottom : 4px;

}

.gsc-resultsHeader td.gsc-twiddleRegionCell{

  width: 75%;

}

.gsc-resultsHeader td.gsc-configLabelCell{

  text-align: right;

  width: 75%;

}

/*

 * note that the next three classes are all joined together

 * to implement the twiddle image. apps can substitute in their

 * own images but will need to account for the image size here

 * as well as in the left padding of the title element

 *

 * Note: uds provides the following images that work with the geometry/padding defined below

 *  to use these images simply over-ride the.gsc-twiddle-opened/-closed class and specify an alternate

 image

 *  or use an image of your own design

 */

.gsc-resultsHeader .gsc-twiddle{

  margin-top: 4px;

  display: inline;

  cursor: pointer;

  background-repeat: no-repeat;

  background-position: 0px 2px;

}

.gsc-resultsHeader td.gsc-twiddle-closed div.gsc-twiddle{

  background-image: url('/uds/css/arrow_close.gif');

}

.gsc-resultsHeader td.gsc-twiddle-opened div.gsc-twiddle{

  background-image: url('/uds/css/arrow_open.gif');

}

.gsc-resultsHeader .gsc-title{

  color: #676767;

  margin-right: 10px;

  padding-left: 14px;

  display: inline;

}

.gsc-resultsHeader .gsc-stats {

  color: #676767;

  font-size: 11px;

  font-weight: normal;

  display : inline;

}

.gsc-resultsHeader td.gsc-twiddle-opened .gsc-stats {

  display : none;

}

/*

 * .gsc-results-selector : box surrounding individual selectors for 1, more, or all results

 * .gsc-result-selector : an individual selector

 * .gsc-one-result : single result selector

 * .gsc-more-results : more (4) results selector

 * .gsc-all-results : all results (8) selector

 */

.gsc-results-selector {

  display : inline;

}

.gsc-resultsHeader td.gsc-twiddle-closed .gsc-results-selector {

  display : none;

}

.gsc-result-selector {

  cursor : pointer;

  display : inline;

  font-size : 13px;

  padding-left : 13px;

  background-repeat: no-repeat;

  background-position: center left;

}

/* default mode is dark */

.gsc-one-result {

  background-image: url('/uds/css/one-complex-dark.gif');

}

.gsc-more-results {

  background-image: url('/uds/css/more-complex-dark.gif');

}

.gsc-all-results {

  background-image: url('/uds/css/all-complex-dark.gif');

  padding-right : 1px;

}

/* active mode is light */

.gsc-one-result-active .gsc-one-result {

  background-image: url('/uds/css/one-complex-light-blue.gif');

}

.gsc-more-results-active .gsc-more-results {

  background-image: url('/uds/css/more-complex-light-blue.gif');

}

.gsc-all-results-active .gsc-all-results {

  background-image: url('/uds/css/all-complex-light-blue.gif');

}

.gsc-resultsHeader .gsc-configLabel{

  color: #676767;

  display: inline;

  font-size: 11px;

  cursor: pointer;

}

.gsc-resultsHeader td.gsc-configLabelCell span.gsc-twiddle-closed {

  padding-right: 12px;

  background-repeat: no-repeat;

  background-position: center center;

  background-image: url('/uds/css/settings.gif');

}

/* tabbed mode of search control

 * .gsc-tabsArea : the box containing all of the tabs

 * .gsc-tabsAreaInvisible : same as above, but this is the state when search has been cleared

 * .gsc-tabHeader : an individual tab

 * .gsc-tabHeader.gsc-tabhActive : the active tab

 * .gsc-tabHeader.gsc-tabhInactive : an inactive tab

 * .gsc-tabData : the data area/box containg results and header data for each tab

 * .gsc-tabData.gsc-tabdActive : the data area for the active tab

 * .gsc-tabData.gsc-tabdInactive : the data area for inactive tabs

 */

.gsc-tabsArea {

  clear: both;

  margin-top: 6px;

  }

.gsc-tabsArea .gs-spacer {

  font-size : 1px;

  margin-right : 2px;

  overflow : hidden;

}

.gsc-tabsArea .gs-spacer-opera {

  margin-right : 0px;

}

.gsc-tabsAreaInvisible {

  display : none;

  }

.gsc-tabHeader {

  display: inline;

  cursor: pointer;

  padding-left: 6px;

  padding-right: 6px;

  margin-right: 0px;

  }

.gsc-tabHeader.gsc-tabhActive {

  border-left: 1px solid #e9e9e9;

  border-right: 1px solid #e9e9e9;

  border-top: 2px solid #ff9900;

  color: black;

  }

.gsc-tabHeader.gsc-tabhInactive {

  border-left: 1px solid #e9e9e9;

  border-right: 1px solid #e9e9e9;

  border-top: 2px solid #e9e9e9;

  background: #e9e9e9;

  color: #676767;

  }

.gsc-tabData.gsc-tabdActive {

  display: block;

  }

.gsc-tabData.gsc-tabdInactive {

  display: none;

  }

/* tab specific results header supression

 * - no twiddle, tabbed mode runs in full expand mode

 * - no title

 * - no stats

 */

.gsc-tabData .gsc-resultsHeader .gsc-title {

  display: none;

  }

.gsc-tabData .gsc-resultsHeader .gsc-stats {

  display: none;

  }

.gsc-tabData .gsc-resultsHeader .gsc-results-selector {

  display : none;

}

/* the results for each section

 * .gsc-resultsbox-{visible,invisible} : a complete-collection of results including headers

 * .gsc-results : the collection of results for a given searcher

 * .gsc-result : a generic result within the control. each result has this class, as well as .gsc-xxxResult

 where xxx is web, image, local, blog, etc.

 */

.gsc-resultsbox-visible {

  display : block;

}

.gsc-resultsbox-invisible {

  display : none;

}

.gsc-results {

  clear: both;

  padding-bottom: 2px;

}

.gsc-result {

  margin-bottom: 10px;

}

.gsc-result .gs-title {

  height: 1.4em;

  overflow: hidden;

  }

/* specialized, result type specific, fine grained controls */

.gsc-result div.gs-watermark {

  display: none;

}

/* Ads

 */

.gsc-results .gsc-result img.gs-ad-marker {

  display: none;

}

/* Standard configuration div/form */

div.gsc-config {

  border: 1px solid #e9e9e9;

  margin-top: 0px;

  margin-bottom: 10px;

  padding-top : 2px;

  padding-left : 6px;

  padding-right : 6px;

  padding-bottom : 6px;

}

form.gsc-config {

  margin-bottom : 0px;

}

.gsc-configSetting {

  margin-top : 6px;

  }

.gsc-configSetting_Label {

  color: #676767;

  }

.gsc-configSettingInput {

  color: #676767;

  border: 1px solid #e9e9e9;

  width: 75%;

  }

.gsc-configSettingCheckbox {

  color: #676767;

  margin-right: 6px;

  }

.gsc-configSettingCheckboxLabel {

  display : inline;

  color: #676767;

  }

div.gsc-configSettingSubmit {

  margin-top : 8px;

  text-align : right;

}

input.gsc-configSettingSubmit {

  display: inline;

  font-size: 11px;

  cursor: pointer;

}

/* Image Search

 */

.gsc-imageResult {

  float: left;

  margin-bottom: 1em;

  margin-right: 20px;

}

.gs-imageResult {

  width: 114px; /* default width + 1px border */

  overflow : hidden;

}

.gs-imageResult .gs-image-box {

  height: 86px; /* default height + 1px border */

  position : relative;

}

/* note, left edge is auto-set by search control */

.gs-imageResult .gs-image-box img.gs-image {

  position : absolute;

  bottom : 0px;

}

.gs-imageResult .gs-text-box {

  text-align: center;

  overflow : hidden;

  height: 4em;

}

.gs-imageResult .gs-snippet {

  overflow : hidden;

  line-height: 1em;

  cursor : pointer;

  white-space : nowrap;

}

.gs-imageResult .gs-visibleUrl {

  cursor : pointer;

}

.gs-imageResult .gs-size {

  color: #6f6f6f;

}

/* Video Search

 * - single line title

 */

.gsc-videoResult .gs-videoResult .gs-title {

  line-height: 1.3em;

  height: 1.3em;

  overflow: hidden;

  }

.gsc-videoResult .gs-videoResult .gs-snippet {

  line-height: 1.3em;

  max-height: 2.6em;

  overflow: hidden;

  }

/* trailing more link at the bottom of

 * a collection of results

 */

.gsc-imageResult .gsc-trailing-more-results {

  clear : both;

}

.gsc-results .gsc-trailing-more-results {

  margin-bottom : 10px;

}

.gsc-results .gsc-trailing-more-results,

.gsc-results .gsc-trailing-more-results * {

  color: #0000cc;

  text-decoration: underline;

}

/* trailing cursor section

 */

.gsc-imageResult .gsc-cursor-box {

  clear : both;

}

.gsc-results .gsc-cursor-box .gsc-trailing-more-results {

  margin-bottom : 0px;

  display : inline;

}

.gsc-results .gsc-cursor {

  display : inline;

}

.gsc-results .gsc-cursor-box {

  margin-bottom : 10px;

}

.gsc-results .gsc-cursor-box .gsc-cursor-page {

  cursor : pointer;

  color : #000000;

  text-decoration: underline;

  margin-right : 8px;

  display : inline;

}

.gsc-results .gsc-cursor-box .gsc-cursor-current-page {

  color : #A90A08;

  font-weight : bold;

  text-decoration: none;

}

/*** End of Control, Begin Results ***/

/* generic, cross cutting result style

 * - in the form of .gs-result .gs-xxx where xxx is the generic style

 * .gs-title : typically the first line of a result, typically a link, image results over ride this,

 since for image results, the image is the link

 * .gs-divider : typically seperates results from ads

 * .gs-visibleUrl : typically the last line of a result, displayed in green. sometimes a link (like in

 blog search)

 * .gs-clusterUrl : for news, and other similar services, this is a cluster of additional results

 * img.gs-image : an actial image in a result

 * .gs-phone : a phone number

 * .gs-address : an address (includes street, city, region, country)

 * .gs-streetAddress : a street (including #)

 * .gs-city : a city

 * .gs-region : a region (zip code, area, etc.)

 * .gs-country : a country

 * .gs-snippet : snippetized content

 * .gs-watermark : indicator that user selected this result

 * .gs-metadata : generic metadata, e.g.,

 * .gs-image-box : generic container for a result's image (within a table)

 * .gs-text-box : generic container for a result's text content (within a table). Note that this class

, and image-box are only used in video

 */

.gs-result .gs-title,

.gs-result .gs-title * {

  color: #0000cc;

  text-decoration: underline;

}

.gs-divider {

  padding-bottom: 8px;

  text-align: center;

  color: #676767;

}

.gs-result a.gs-visibleUrl,

.gs-result .gs-visibleUrl {

  color: #008000;

  text-decoration: none;

}

/* relative and absolute dates, note, news/books inlines these */

.gs-relativePublishedDate,

.gs-publishedDate {

  color: #6f6f6f;

  text-decoration: none;

}

.gs-result a.gs-clusterUrl,

.gs-result .gs-clusterUrl {

  color: #008000;

  text-decoration: underline;

  cursor: pointer;

}

.gs-newsResult .gs-publisher {

  color: #6f6f6f;

  display : inline;

  text-decoration: none;

}

/*

 * For news results there are two dates...

 * The relative date is visible while in the

 * search control and the published date

 * is visible when clipped. Why? It doesn't

 * make sense to say 4 hours ago for a clipped

 * result...

 */

/* establish the base style */

.gs-newsResult .gs-relativePublishedDate,

.gs-newsResult .gs-publishedDate {

  display : inline;

  margin-left : 4px;

}

/* base styling for relative date is none */

.gs-blogResult .gs-relativePublishedDate,

.gs-newsResult .gs-relativePublishedDate {

  display : none;

}

/* suppress publishedDate while in the control */

.gsc-blogResult .gs-blogResult .gs-publishedDate,

.gsc-newsResult .gs-newsResult .gs-publishedDate {

  display : none;

}

/* enable relativePublishedDate while in the control */

.gsc-blogResult .gs-blogResult .gs-relativePublishedDate,

.gsc-newsResult .gs-newsResult .gs-relativePublishedDate {

  display : inline;

}

.gs-newsResult .gs-location {

  color: #6f6f6f;

  display : inline;

  text-decoration: none;

}

.gs-result img.gs-image {

  vertical-align : middle;

  border : 1px solid #0000cc;

}

.gs-result div.gs-phone {}

.gs-result .gs-directions,

.gs-result .gs-directions * {

  color: #7777cc;

  font-weight: normal;

  text-decoration : underline;

  cursor : pointer;

}

.gs-secondary-link,

.gs-secondary-link * {

  color: #7777cc;

  font-weight: normal;

  text-decoration : underline;

  cursor : pointer;

}

/* wrapper around user supplied to/from mode directions

 * normally this is disabled by default, and gs-directions is enabled

 * apps can easily switch this by setting display:block on the rule below,

 * and display:none on the rule above

 * e.g., add these two rules to switch local results into

 * alternate style driving directions

 * .gs-localResult .gs-directions-to-from { display : block; }

 * .gs-localResult .gs-directions { display : none; }

 */

.gs-result .gs-directions-to-from {

  display : none;

  margin-top : 4px;

}

.gs-result .gs-directions-to-from .gs-label {

  display : inline;

  margin-right : 4px;

}

.gs-result .gs-directions-to-from div.gs-secondary-link {

  display : inline;

}

.gs-result .gs-directions-to-from .gs-spacer {

  display : inline;

  margin-right : 3px;

  margin-left : 3px;

}

.gs-videoResult a.gs-publisher,

.gs-videoResult .gs-publisher {

  color: #008000;

  text-decoration: none;

}

.gs-result a {

  cursor: pointer;

}

.gs-result .gs-address {

}

.gs-result .gs-snippet {

}

.gs-no-results-result .gs-snippet,

.gs-error-result .gs-snippet {

  padding : 5px;

  margin : 5px;

  border : 1px solid rgb(255,204,51);

  background-color : rgb(255,244,194);

}

.gs-result .gs-watermark{

  font-size: 10px;

  color: #7777cc;

}

div.gs-results-attribution {

  text-align : center;

  margin-bottom : 4px;

}

div.gs-results-attribution,

div.gs-results-attribution * {

  font-size : 10px;

  color : #676767;

  text-decoration : none;

}

div.gs-results-attribution a {

  color: #0000cc;

  cursor : pointer;

}

div.gs-results-attribution a:hover {

  text-decoration : underline;

}

.gs-result .gs-metadata{

  color: #676767;

}

/* searcher specific styling for

 * - web ad

 * - web

 * - local

 * - image (none)

 * - blog (none)

 * - video (none)

 */

/* webAd search specific over rides

 * .gs-ad-marker : disabled in control, but on in green to indicate clipped result is an ad

 */

.gs-localAd img.gs-ad-marker,

.gs-webAd img.gs-ad-marker {

  padding-left: 4px;

}

/* default is to not show long mode visible urls

 * apps should selectively enable this while disabling

 * div.gs-visibleUrl-short

 */

.gs-webResult div.gs-visibleUrl-long {

  width : 100%;

  overflow : hidden;

  display : none;

}

/* local search specific over rides

 * - city, region displayed inline

 * - country supressed

 * - small font size for info window's

 */

.gs-localAd div.gs-address * {

  color : #676767;

}

.gs-localAd div.gs-street {

  display: inline;

}

div.gs-city {

  display: inline;

}

div.gs-region {

  display: inline;

}

div.gs-country {

  display: none;

}

div.gs-infoWindow * {

  font-size: 11px;

  }

/* video search specific over rides

 * - align the table data

 * - default image width garuntee

 * - appropriate cell seperation

 */

/* todo(markl): workaround until gre in gmail fixes his styles */

.gs-videoResult * {

  font-size: 13px;

  }

/*

.gs-videoResult td .gs-image {

  vertical-align : middle;

}

.gs-videoResult td.gs-image-box {

  background-color : #000000;

}*/

.gs-videoResult td div.gs-image-box {

  width : 110px;

  height : 78px;

}

.gs-videoResult td div.gs-text-box {

  vertical-align: top;

  margin-left: 4px;

  }

/* book search specific over rides

 * - default image width garuntee

 * - appropriate cell seperation

 */

div.gs-book-image-box td,

.gs-bookResult td {

  vertical-align : top;

}

div.gs-book-image-box,

div.gs-book-image-box div {

  position : static;

  text-align : start;

}

div.gs-book-image-box {

  width : 75px;

  height : 90px;

}

.gs-bookResult td div.gs-text-box {

  vertical-align: top;

  margin-left: 4px;

  }

div.gs-book-image-box img {

  border-spacing : 0px 0px;

  border : none;

}

div.gs-book-image-box div.gs-row-1 {

  line-height : 7px;

}

div.gs-book-image-box img.gs-pages {

  height : 7px;

  width : 45px;

}

div.gs-book-image-box img.gs-page-edge {

  height : 7px;

  width : 11px;

}

div.gs-book-image-box div.gs-row-2 {

}

div.gs-book-image-box img.gs-image {

  height : 80px;

  border : 1px solid #a0a0a0;

}

.gs-bookResult .gs-author {

  display : inline;

  color: #6f6f6f;

}

.gs-bookResult .gs-publishedDate {

  display : inline;

}

.gs-bookResult .gs-pageCount {

  display : inline;

  color: #6f6f6f;

  margin-left : 4px;

}

.gs-bookResult .gs-id {}