@charset: 'utf-8';

/**
 * Styles for the Site Search Results page
 *
 * Colors:
 *   light brown: #f2f3ed
 *   brown: #838064
 *   dark brown: #686550
 *   orange: #f85e10
 *   yellow: #fded28
 *   green: #61a5aa
 */

.serp {
  width: 584px;
}

.serp > *,
.serp form > * {
  margin-top: 15px;
}

/* counter the top margin from the declaration above on the first elements */
.serp #system-message-container,
.serp .blog-featured {
  margin-top: 0;
}

.serp h1 {
  color: #f85e10 /* orange */;
}

/**
 * Forms and fieldsets surrounding the search box and filters
 */

.serp fieldset {
  background: #f2f3ed /* light brown */;
  border: #686550 /* dark brown */ solid 1px;
  /* todo: border radius? */
  padding: 10px 0;
  text-align: center;
  width: 90%
}

.serp form label + input,
.serp label + select {
  margin-left: 2px;
}

.serp legend {
  color: #686550 /* dark brown */;
  font-size: 14px;
  margin-left: 2%;
  padding: 0 5px;
  text-align: left;
}

/* this is really just for Firefox */
.serp select {
  border: #cccccc /* grey */ solid 1px;
}

/**
 * Search Filters form elements
 */

.serp label {
  color: #838064 /* brown */;
}

.serp input + label {
  margin-right: 15px;
}

/* the text input with the terms for the currently displayed results */
.serp #search-searchword {
  height: 21px;
  line-height: 21px;
  width: 35%;
}

/* the submit button for the search form at the top */
.serp input[type=submit] {
  margin-left: 5px;
  padding: 4px 5px;
}

/* the totals label below the first form */
p.totals {
  font-size: 14px;
  font-weight: bold;
}

/* the total pages and num_results selector below the search filters */
p.counter {
  float: left;
}

.form-limit {
  float: right;
  margin-right: 10%;
}


/**
 * Results list
 */

#serp-results {
  /* todo: this is an OL. do we even need the numbers? */
  clear: both;
  list-style: none;
  padding: 10px 10% 0 0;
}

#serp-results li {
  border-bottom: #f2f3ed /* light brown */ solid 1px;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

#serp-results .number {
  float: left;
  height: 100%;
  margin-left: 0;
  min-height: 70px;
  width: 30px;
}

#serp-results h5 {
  color: #f85e10 /* orange */;
  display: inline;
  font-size: 14px;
}

#serp-results p {
  color: #838064 /* brown */;
  margin-left: 30px;
}

#serp-results p.category {
  display: inline;
  margin-left: 5px;
}

#serp-results p.date {
  color: #61a5aa /* green */;
  display: block;
  margin-top: 5px;
  text-align: right;
}

/**
 * Pagination at bottom of page
 */

.serp .pagination {
  display: block;
  margin: 10px 0;
  text-align: center;
  width: 90%;
}

.serp .pagination a,
.serp .pagination li {
  color: #838064 /* brown */;
  font-weight: normal;
  padding: 2px 5px;
}

.serp .pagination a {
  border: #f85e10 /* orange */ solid 1px;
  display: block;
}

.serp .pagination li {
  display: inline-block;
  position: relative;
}

/* define the "active" state */
.serp .pagination li span {
  color: #686550 /* dark brown */;
  font-weight: bold;
}

/* make sure the First, Prev, Next, and Last LIs never get the "active" state */
.serp .pagination li[class|="pagination"] span {
  color: #838064 /* brown */;
  font-weight: normal;
}


/* search module button config */
/*search module */
.search {
  width: 210px;
  float: right;
  margin: 7px 0 0;
  }
.search label {
  display: none;
  }
.search input {
  font-size: 10px;
  height: 16px;
  margin: 0;
}
.search input[type=text] {
  border-left: #adb8cc solid 1px;
  border-top: #e4e9ed solid 1px;
  border-right: #e4e9ed solid 1px;
  border-bottom: none;
  color: #000000;
  font-family: Arial, sans-serif;
  font-weight: bold;
  line-height: 16px;
  padding: 0 5px;
  width: 173px;
}
.search input[type=text]::-webkit-input-placeholder,
.search input[type=text]::-moz-placeholder {
  color: #a3a18c;
}
.search button[type=submit] {
  background-color: #7d8a9d /* blue grey */;
  color: #ffffff /* white */;
  letter-spacing: 0;
  min-width: 22px;
  padding: 0 0 1px 1px;
  text-transform: uppercase;
  border:  none;
  height: 16px;
}

/* primary search form */
button[type=submit] {
  background: #7d8a9d /* blue grey */;
  color: #ffffff /* white */;
  cursor: pointer;
  letter-spacing: 1px;
  padding: 2px 5px;
  text-transform: uppercase;
}