body {
  background-color: #faf0e0;
  color: black;
  font: normal 15px Georgia, Times, "Times New Roman", serif;
  margin: 0;
  padding: 0;
  min-width: 900px;
}

h1 {
  font: bold 160% "Bitstream Vera Sans", Arial, sans-serif;
  font-variant: small-caps;
  letter-spacing: 2px;
}

div.noscript {
  background-color: #ddd;
  border: 1px solid #999;
  font-size: 90%;
}

div.noscript p {
  background: url(../images/warning-32.png) no-repeat 0 2px;
  margin: 1ex;
  padding-left: 40px;
}

#content {
  margin: 1em;
}

#header {
  background: url(../images/header.jpg) no-repeat scroll 0 0;
  font-size: 10px;
  height: 80px;
  margin: 0;
  position: relative;
  z-index: 1;
}
#header #title a#home {
  height: 48px;
  left: 20px;
  position: absolute;
  text-decoration: none;
  top: 8px;
  width: 488px;
}
#header #title a i {
  visibility: hidden;
}
#header #account {
  list-style: none;
  float: right;
  font-family: "Liberation Sans", "Bitstream Vera Sans", Arial, sans-serif;
  margin: 4px 8px;
  padding: 0;
}
#header #account li {
  clear: both;
  color: #0000f0;
  font-weight: bold;
  margin: 2px 0;
  text-align: right;
}
#header #account li a {
  background-color: #f0f0f0;
  color: #03c;
  display: block;
  float: right;
  margin: 2px 0;
  padding: 0.2em 0.5em;
  text-align: center;
  text-decoration: none;
  width: 7em;
  /* use rounded borders where possible */
  border-radius: 1em;
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
}
#header #account li a:hover {
  background-color: #03c;
  color: #f0f0f0;
}
#header #translate-menu {
  float: right;
  margin: 6px;
}
#header #translate-menu p {
  color: #222;
  font: bold 12px "Liberation Sans", "Bitstream Vera Sans", Arial, sans-serif;
  margin: 0;
}
#header #translate-menu select {
  font-size: 14px;
}

#footer {
  border-top: 2px solid #ffc125;
  height: 4ex;
  padding: 4px;
}
#footer #disclaimer {
  float: left;
  font-size: 80%;
  margin: 0 1em;
  width: 70%;
}
#footlinks {
  color: #036;
  font: normal 12px "Liberation Sans", "Bitstream Vera Sans", Arial, sans-serif;
  float: right;
  list-style: none;
  margin: 0 0.5em;
  text-align: right;
  width: 20%;
}
#footlinks li {
  display: inline;
  padding: 0 0.5em;
}
#footlinks a {
  color: #036;
}

#breadcrumbs {
  background-color: #f0f0f0;
  border-bottom: 2px solid #ffc125;
  border-top: 2px solid #ffc125;
  color: #036;
  display: inline;
  font: normal 90% "Liberation Sans", "Bitstream Vera Sans", Arial, sans-serif;
  padding: 4px;
}
#breadcrumbs a {
  color: #3282bf;
}
#breadcrumbs a:hover {
  color: #903443;
}

.clearfloat {
  clear: both;
}

#flash-message {
  color: #000000;
  font: bold 100% "Bitstream Vera Sans", Arial, sans-serif;
}

#flash-info {
  color: #00f000;
  font: bold 100% "Bitstream Vera Sans", Arial, sans-serif;
}

#flash-notice {
  color: #0000f0;
  font: bold 100% "Bitstream Vera Sans", Arial, sans-serif;
}

#flash-warning {
  color: #f08000;
  font: bold 100% "Bitstream Vera Sans", Arial, sans-serif;
}

#flash-error {
  color: #f00000;
  font: bold 100% "Bitstream Vera Sans", Arial, sans-serif;
}

div.fieldWithErrors input, div.fieldWithErrors select, 
div.fieldWithErrors textarea
{
  border: 1px solid #f00000;
}

div.formError {
  color: #f00000;
}

img {
  border: none;
}
img.icon {
  vertical-align: top;
  margin-left: 0.1em;
}

#login-form, #signup-form, #password-form {
  font-size: 90%;
}
#login-form #flash-error, #signup-form #flash-error, #password-form #flash-error {
  margin: 1ex 1em;
}
#user-form ol, #login-form ol, #signup-form ol, #password-form ol, #contact-form ol {
  list-style: none;
  margin-left: 1em;
  padding-left: 0;
}
#user-form li, #login-form li, #signup-form li, #password-form li, #contact-form li {
  margin: 1ex 0;
}
#login-form input#openid_url, #signup-form input#openid_url {
  background: #fff url(../images/openid-login.gif) no-repeat scroll 0pt 50%;
  padding-left: 18px;
}
#login-form input#openid_url:focus, #signup-form input#openid_url:focus {
  background-color: #ffc;
}
#user-form label, #login-form label, #signup-form label, #password-form label, #contact-form label {
  margin: 2px;
}
#contact-form li {
  clear: both;
}
#contact-form label {
  float: left;
  margin-right: 0.5em;
  text-align: right;
  width: 10em;
}
#contact-form .buttons {
  margin-left: 11em;
}
#contact-form span.note {
  font-size: 90%;
}
#contact-form #flash-error ol {
  list-style-image: url(../images/exclamation.png);
  margin-left: 1em;
  padding-left: 1em;
}

#user-form div.formError, #login-form div.formError, #signup-form div.formError, #password-form div.formError, #contact-form div.formError {
  margin: 2px;
}
#password-form label {
  width: 4em;
}
#user-form input[type="text"], #user-form input[type="password"],
#login-form input[type="text"], #login-form input[type="password"],
#signup-form input[type="text"], #signup-form input[type="password"],
#password-form input[type="text"], #password-form input[type="password"] {
  margin: 0 auto 1ex;
  width: 90%;
}
#user-form div.fieldWithErrors input[type="text"], #user-form div.fieldWithErrors input[type="password"],
#login-form div.fieldWithErrors input[type="text"], #login-form div.fieldWithErrors input[type="password"],
#signup-form div.fieldWithErrors input[type="text"], #signup-form div.fieldWithErrors input[type="password"],
#password-form div.fieldWithErrors input[type="text"], #password-form div.fieldWithErrors input[type="password"],
#contact-form div.fieldWithErrors input[type="text"], #contact-form div.fieldWithErrors textarea {
  margin-bottom: 0;
}
#user-form fieldset, #login-form fieldset, #signup-form fieldset, #password-form fieldset {
  float: left;
  margin: 0 1ex 2ex;
  padding: 0 1ex;
  width: 20em;
}
#login-form fieldset.openid, #signup-form fieldset.openid, #password-form fieldset.openid {
  width: 24em;
}
#password-form fieldset {
  width: 18em;
}
#user-form legend, #login-form legend, #signup-form legend, #password-form legend {
  padding: 0 1ex;
}
#user-form .buttons, #login-form .buttons, #signup-form .buttons, #password-form .buttons, #contact-form .buttons {
  clear: both;
  padding: 0 1ex;
}
#login-form .buttons a {
  padding: 0;
}
#login-form div.separator, #signup-form div.separator {
  float: left;
  padding: 7ex 1em;
}
#signup-form p {
  padding: 0 0.5em;
}
#signup-form form {
  padding-top: 2ex;
}
#login-form fieldset p, #signup-form fieldset p {
  margin-left: 1em;
  padding-left: 0;
}

#user-profile dl {
  line-height: 24px;
  margin: 0 2em;
}
#user-profile dt {
  clear: left;
  float: left;
  font-weight: bold;
  width: 6em;
}
#user-profile dd {
  float: left;
  margin-left: 0;
}
#user-profile dd a {
  text-decoration: none;
}
#user-profile .buttons {
  clear: both;
  margin-left: 1em;
  padding-top: 2ex;
}
#user-profile .buttons a {
  color: #0080a4;
  cursor: pointer;
  font: bold 14px "Bitstream Vera Sans", Arial, sans-serif;
  text-decoration: none;
}

h1 a.title-link {
  font-size: 80%;
  text-decoration: none;
}

#search-options {
  background-color: #f0f4ff;
  border: 2px ridge #999;
  font-size: 90%;
  margin-bottom: 1ex;
}
#search-options .secondary-search {
  margin-right: 2em;
}
#search-options fieldset.sub-field {
  border: 1px solid #333;
  margin: 1ex 0;
  padding: 1ex;
}
#search-options fieldset.sub-field legend {
  color: black;
  font: normal 100% Georgia, Times, "Times New Roman", serif;
}
#search-options ul.checkbox-list {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
#search-options ul.checkbox-list li {
  float: left;
  margin-right: 1em;
}
#search-options p.note {
  clear: both;
  color: #333;
  font-size: 90%;
  height: 2ex;
  padding-top: 2ex;
}
#search-options span.sc {
  font-variant: small-caps;
  font-weight: bold;
  margin-right: 0.5ex;
}
#search-options-wrapper {
  clear: both;
  margin: 1ex 0;
  padding: 1ex;
}

.title-bar {
  background-color: #c0c7ff;
}
.title-bar h4 {
  color: #001f7f;
  font: bold 120% "Liberation Sans", "Bitstream Vera Sans", Arial, sans-serif;
  margin: 0 0 0 4px;
  padding: 2px;
}
.title-bar .controls {
  float: right;
  height: 20px;
  margin: 2px;
}
.title-bar .controls span {
  cursor: pointer;
}

#disambiguate-location {
  background-color: #f0f4ff;
  border: 1px solid #333;
  font-weight: bold;
  max-width: 350px;
  padding: 0 1em;
  position: absolute;
  z-index: 10000;
}
#disambiguate-location .close-button {
  background: url(../images/close.png) 0 0 no-repeat;
  color: #001f7f;
  cursor: pointer;
  float: right;
  font-weight: bold;
  height: 17px;
  margin: 4px -8px 8px 8px;
  text-decoration: none;
  text-indent: -4000px;
  width: 16px;
}
#disambiguate-location p {
  margin-bottom: 0.5em;
}
#disambiguate-location-list {
  list-style: none;
  margin-top: 0.5em;
  padding: 0;
}
#disambiguate-location-list li {
  padding: 0.5ex 0;
}
#disambiguate-location-list li a, #disambiguate-location-list li a:visited {
  color: #001f7f;
  display: block;
  text-decoration: none;
}
#disambiguate-location-list li a:hover {
  color: #bf1f00;
}

input[type="text"], input[type="password"], input[type="file"], textarea {
  background-color: #fff;
  border: 1px solid #666;
  padding: 1px 2px;
}
input[type="text"]:focus, input[type="password"]:focus, input[type="file"]:focus, textarea:focus {
  background-color: #ffc;
  border: 1px solid #000;
}
input[type="submit"], input[type="reset"], input[type="button"], button {
  margin-right: 1em;
  padding: 1px 4px;
}

#tabnav {
  background-color: #c0c7ff;
  border-bottom: 2px solid #001f7f;
  border-top: 2px solid #001f7f;
  height: 28px;
  line-height: 28px;
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
}
#tabnav li {
  display: block;
  float: left;
  margin: 0;
  padding: 0 1ex;
}
#tabnav li a {
  border: none;
  color: #001f7f;
  display: block;
  float: left;
  font: bold 14px "Liberation Sans", "Bitstream Vera Sans", Arial, sans-serif;
  height: 28px;
  line-height: 28px;
  padding: 0 1ex;
  position: relative;
  text-decoration: none;
}
#tabnav li a:hover, #tabnav li a.selected {
  background-color: #f0f0f0;
}

.panel {
  display: block;
  padding: 3ex 1em 1ex 1em;
}
.panel p {
  height: 5ex;
  margin: 0;
}
.panel span.loading-indicator {
  color: #2163d6;
  font: bold 14px "Bitstream Vera Sans", Arial, sans-serif;
  padding: 0 1em;
}
.panel span.loading-indicator img {
  margin-bottom: -2px;
}
.panel span.message {
  color: #0000f0;
  font: bold 14px "Bitstream Vera Sans", Arial, sans-serif;
  padding: 0 1em;
}
.panel span.error {
  color: #f00000;
  font: bold 14px "Bitstream Vera Sans", Arial, sans-serif;
  padding: 0 1em;
}

dl.feature-list.two-column {
  column-count: 2;
  column-gap: 1em;
  -moz-column-count: 2;
  -moz-column-gap: 1em;
  -webkit-column-count: 2;
  -webkit-column-gap: 1em;
}
dl.feature-list dt {
  font: bold 16px "Bitstream Vera Sans", Arial, sans-serif;
  margin: 1.5ex 0 1ex;
}
dl.feature-list dd {
  margin: 0 1em;
}
dl.feature-list dt img {
  margin-bottom: -4px;
  margin-right: 4px;
}

#map-header {
  padding: 2px;
}
#map-wrapper {
  border: 2px ridge #999;
  height: 450px;
  margin-bottom: 1em;
}
#map {
  float: left;
  height: 100%;
  width: 80%;
}
#map-loading-message {
  color: #2163d6;
  font: normal 24px "Bitstream Vera Sans", Arial, sans-serif;
  position: relative;
  top: 50%;
  left: 10%;
  width: 80%;
  overflow: hidden;
  height: 2em;
  line-height: 2em;
  margin-top: -1em;
}
#map .loading-message img {
  margin-bottom: -6px;
}
#map .location-info {
  background-color: #fff;
  font: normal 12px/14px "Bitstream Vera Sans", Arial, sans-serif;
  overflow: auto;
}
#map .overview {
  overflow: hidden;
}
#map .overview > *:first-child,
#map .details > *:first-child,
#map .directions > *:first-child {
  margin-right: 12px;  /* Stay clear of the close button */
  margin-top: 0;
}
#map .overview span {
  clear: both;
  float: left;
}
#map .overview .brewery-type-icon {
  position: absolute;
  top: -8px;
  left: -12px;
}
#map span.info-name {
  font-weight: bold;
  padding-right: 8px;
}
#map span.info-status {
  color: #f00000;
  font-weight: bold;
}
#map span.info-address {
}
#map span.info-phone {
}
#map span.info-url a {
  text-decoration: none;
  white-space: nowrap;
}
#map ul.feature-list {
  margin: 3px 0 0 0;
}
#map span.info-action {
  margin: 6px 0 0 0;
}

#map dl.feature-list {
  margin: 4px;
}
#map dl.feature-list dt {
  margin: 0 0 1ex;
}
#map dl.feature-list dd {
  margin: 0 0 1.5ex;
}

#map .directions {
  overflow: hidden;
}
#map .directions a.selected {
  color: black;  /* IE doesn't like inherit */
  cursor: text;
  font-weight: bold;
  text-decoration: none;
}

#map-legend {
  background-color: #fff;
  float: right;
  font-size: 75%;
  height: 100%;
  overflow: auto;
  width: 20%;
}
#map-legend ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
#map-legend ul li {
  margin: 0.5ex;
}
#map-legend a {
  color: #005cb8;
  display: block;
  text-align: left;
  text-decoration: none;
}

#map .details h1, .brewery-form .preview h1,
#map .details h2, .brewery-form .preview h2,
#map .details h3, .brewery-form .preview h3,
#map .details h4, .brewery-form .preview h4,
#map .details h5, .brewery-form .preview h5,
#map .details h6, .brewery-form .preview h6 {
  color: inherit;
  font-family: inherit;
  font-variant: normal;
  font-weight: bold;
  letter-spacing: 0;
  padding: 0;
}
#map .details h1, .brewery-form .preview h1 {
  font-size: 150%;
  margin: 0.67em 0;
}
#map .details h2, .brewery-form .preview h2 {
  font-size: 140%;
  margin: 0.71em 0;
}
#map .details h3, .brewery-form .preview h3 {
  font-size: 130%;
  margin: 0.77em 0;
}
#map .details h4, .brewery-form .preview h4 {
  font-size: 120%;
  margin: 0.83em 0;
}
#map .details h5, .brewery-form .preview h5 {
  font-size: 110%;
  margin: 0.9em 0;
}
#map .details h6, .brewery-form .preview h6 {
  font-size: 100%;
  margin: 1.0em 0;
}
#map .details p, .brewery-form .preview p {
  margin: 1em 0;
}
#map .details blockquote, .brewery-form .preview blockquote {
  margin: 1em 2em;
}
#map .details ol, .brewery-form .preview ol {
  list-style-type: decimal;
}
#map .details ol, .brewery-form .preview ol,
#map .details ul, .brewery-form .preview ul {
  margin: 1em 2em;
  padding-left: 1em;
}
#map .details ol ol, .brewery-form .preview ol ol,
#map .details ol ul, .brewery-form .preview ol ul,
#map .details ul ul, .brewery-form .preview ul ul,
#map .details ul ol, .brewery-form .preview ul ol {
  margin: 0 2em;
  padding-left: 0;
}
.brewery-form .preview > *:first-child {
  margin-top: 0;
}

#icon-legend {
  float: left;
  font-size: 90%;
}
#icon-legend ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}
#icon-legend ul li {
  float: left;
  margin-right: 1em;
}
#icon-legend span {
  padding: 2px;
}

#actions {
  float: right;
  padding: 2px 0;
  text-align: right;
}
#actions a.disabled {
  color: #666;
  opacity: 0.5;
}
#actions a.disabled:hover {
  background-color: transparent;
  cursor: default;
}
#actions a, #actions span {
  color: #0080a4;
  cursor: pointer;
  font: bold 14px "Bitstream Vera Sans", Arial, sans-serif;
  height: 16px;
  margin-left: 0.5em;
  padding: 0px 4px 5px 20px;
  text-decoration: none;
}
#actions span.help {
  background: url(../images/help.png) no-repeat 0 0;
}
#actions a.new {
  background: url(../images/active_scaffold/default/add.gif) no-repeat 0 0;
}

#help-contents {
  background-color: #faebd7;
  border: 2px ridge #999;
  clear: both;
  font-size: 90%;
  margin-bottom: 10px;
  padding: 0 1em;
}

#map-directions {
  background-color: #f0f4ff;
  border: 2px ridge #999;
  clear: both;
  font: normal 90% "Bitstream Vera Sans", Arial, sans-serif;
  margin-bottom: 1ex;
}
#map-directions-wrapper {
  height: 200px;
  margin: 4px;
  overflow: auto;
}

ul.feature-list {
  list-style: none;
  padding: 0;
}
ul.feature-list li {
  float: left;
  margin-right: 8px;
}
ul.feature-list img {
  cursor: help;
}

div.faq dt {
  font-weight: bold;
  margin-top: 1ex;
}
div.faq dd {
  margin: 2ex 1.5em;
}

span.email {
  font-family: "Liberation Mono", "Andale Mono", "Courier New", Courier, monospace;
  font-size: 90%;
}

#auth-denied {
  background: url(../images/403.gif) top left no-repeat;
  padding: 0 0 0 150px;
  min-height: 150px;
}
#dead-link {
  background: url(../images/404.gif) top left no-repeat;
  padding: 0 0 0 330px;
  min-height: 165px;
}
#auth-denied p, #dead-link p {
  margin-left: 1em;
}

#location-data {
  float: left;
  padding-left: 1em;
}
#location-data h3 {
  clear: both;
}

#location-data .overview {
}
#location-data .overview p {
  margin: 0;
}
#location-data p.info-type {
  color: #0000f0;
  font-style: italic;
  margin: -1em 0 1em -1em;
}
#location-data p.info-status {
  color: #f00000;
  font-weight: bold;
  margin: -1em 0 1em -1em;
}
#location-data .info-address {
  padding-bottom: 1em;
}
#location-data .info-phone {
}
#location-data .info-gps {
}
#location-data .info-url a {
}
#location-data .feature-list {
  margin-top: 1em;
}

#location-data .features {
}
#location-data dl.feature-list {
  margin: 4px;
}
#location-data dl.feature-list dt {
  clear: both;
  float: left;
  margin: 0 0 1ex;
}
#location-data dl.feature-list dd {
  float: left;
}

#location-data .details {
}

#brewery-details #map {
  border: 2px ridge #999;
  float: right;
  height: 250px;
  margin-bottom: 1em;
  overflow: hidden;
  width: 250px;
}
#brewery-details #map-loading-message {
  font-size: 18px;
}

ul#countries, ul#regions {
  column-gap: 1em;
  column-width: 12em;
  list-style: none;
  margin: 0;
  padding: 0;
  -moz-column-gap: 1em;
  -moz-column-width: 12em;
  -webkit-column-gap: 1em;
  -webkit-column-width: 12em;
}
h3.city {
  margin-left: 1em;
}
ul.breweries {
  list-style: none;
  margin-left: 2em;
  padding: 0;
}
ul#countries li, ul#regions li, ul.breweries li {
  display: block;
  margin: 1ex 0;
}