.page_title {
  font-size: 30px;
  color: #004a83;
  margin-top: 5px;
}

.page_title_container {
  margin: 10px 0;
}

.breadcrumbs {
  font-size: 12px;
  color: #ccc;
  margin-bottom: 15px;
}

.breadcrumbs a.link {
  color: #004a83 !important;
  text-decoration: none !important;
}

.breadcrumbs a.link:hover {
  color: #007add !important;
  text-decoration: none;
}

.page_container {
  padding-left: 5px;
  padding-right: 5px;
}

.bold {
  font-weight: bold;
}

.calendarHdr {
  font-size: 14px;
  font-weight: bold;
}

.calendarSub {
  font-style: italic;
  margin-bottom: 20px;
}

.calendarDisclaimer {
  font-size: 11px;
  line-height: 16px;
  margin-top: 25px;
}

/* Our rating of a ship or resort: gold stars from adc-api (RatingStars) with the rating as text,
   on ship and resort pages, the cruise line page's ship cards, the Cruise Ship Ratings page and
   the resort brand pages. Sizes and colors sit on the stars and the text themselves, so the older
   .ratings and .rating_container rules on the same pages leave them alone. */
.our-rating {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
}

.rating-stars {
  display: inline-flex;
  gap: 2px;
  font-size: 16px;
  line-height: 1;
}

.rating-stars svg {
  display: block;
}

.our-rating-text {
  color: #3b4652;
  font-size: 13px;
  font-weight: normal;
}

.our-rating-text strong {
  color: #1f2a37;
}

/* Read out, not shown: where the row's label already says what the number is. */
.our-rating-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* The Cruise Ship Ratings page's cards: the stars and number on one line beside the label. */
.stat .our-rating {
  flex-wrap: nowrap;
  justify-content: flex-end;
}

/* On a ship or resort page, under its name. The How we rate note opens as a small box under
   this row, from its left edge so it fits a phone, and nothing on the page moves. */
.page_title_container .our-rating {
  position: relative;
  margin: 6px 0 12px;
}

.page_title_container .rating-stars {
  font-size: 22px;
}

.page_title_container .our-rating-text {
  font-size: 15px;
}

.our-rating-how summary {
  color: #004a83;
  font-size: 13px;
  cursor: pointer;
  list-style: none;
  text-decoration: underline;
}

.our-rating-how summary::-webkit-details-marker {
  display: none;
}

.our-rating-how p {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 20;
  box-sizing: border-box;
  width: 300px;
  max-width: 100%;
  margin: 6px 0 0;
  padding: 10px 12px;
  border: 1px solid #d6e0ea;
  border-radius: 6px;
  background-color: #fff;
  box-shadow: 0 4px 12px rgb(0 0 0 / 12%);
  color: #3b4652;
  font-size: 13px;
  line-height: 1.4;
}

/* Under a resort's name on its brand page's grid, centered as the name is. */
.cbp-l-grid-work-title .our-rating {
  justify-content: center;
}