/* Breadcrumbs */
ul.breadcrumbs li {
  display: inline;
}

ul.breadcrumbs li a:not([href]) {
  color: #ccc;
}

ul.breadcrumbs li:not(:last-child) a::after {
  content: '/';
  padding: 0 2px 0 6px;
  color: #ccc;
}

/* End Breadcrumbs */

.search_slides_section {
  display: flex;
  width: 100%;
  margin-bottom: 15px;
}

.search_slides_section > .left,
.search_slides_section > .right {
  float: none;
  width: auto;
  flex: 1;
  height: auto;
}

/* The search box keeps its width and the photos take the rest, shrinking with the window, so from
   1025px (where the box leaves the pill) to about 1219px the photos no longer push the page sideways. */
.search_slides_section > .left {
  flex: 0 0 345px;
}

.search_slides_section > .right {
  min-width: 0;
}

.search_slides_section > .left #searchDealsSideBar {
  height: 100%;
}

.search_slides_section > .right .slides_wrapper {
  height: 100%;
  overflow: hidden;
}

.destination_box img {
  width: 100%;
  border: 3px solid #ccc;
}

/* The photo fills the column as tall as the search box beside it, which varies with the tab and
   the fields open. Cover crops the photo to that shape instead of stretching it. */
.search_slides_section > .right .slides_wrapper img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

#main_search_box {
  border: none;
  width: auto;
  margin-right: 15px;
  max-width: 330px;
}

#main_search_box #cruise_tab {
  min-height: auto;
}

#main_search_box div#cruise_tab.tab_content section div#radios {
  margin: 0 0 5px;
}

#main_search_box div#CruiseSearchForm_cruiseRoomsQuestion {
  margin: 15px 0 0;
}

.search_slides_section .swiper_custom_content.bottom {
  bottom: 0 !important;
}

#featured_section {
  margin-bottom: 15px;
}

#featured_section .section_title {
  margin-top: 20px;
  line-height: auto;
}

.cruisesFromSaleSmall {
  font-size: 11px;
  font-style: italic;
  font-weight: normal;
  line-height: 10px;
}

.cruisecontentBold {
  color: #056cd3;
  font-weight: bold;
  font-size: 12px;
}

#filter_mobile {
  display: none;
  padding: 5px;
  border-color: #2882d1;
  color: #2882d1;
  margin: 3px 0 5px;
  background-color: white;
}

#normal_filters {
  display: inline;
}

#tabs_section .content p {
  margin-bottom: 20px;
}

.destination_box {
  float: left;
  width: 50%;
  padding: 2%;
  box-sizing: border-box;
  height: 100%;
}

.destination_box .title {
  text-align: center;
  font-size: 12px;
  font-weight: bold;
}

p.cruiseDestinationIntro {
  margin: 0 0 10px !important;
}

div.tab-attractions.content.active span.cruisecontentBold {
  font-size: 13px;
}

table#portCruiselines {
  margin-top: 12px;
}

.cruise_lines_fancybox:hover {
  text-decoration: none !important;
  line-height: normal;
}

.filter_info h3 {
  color: white !important;
  font-size: 14px !important;
}

#responsive_hot_deal {
  border: #ce4451 thin solid;
  background: #f4f4f4;
  margin: 15px auto;
  line-height: normal;
  font-size: 13px;
  width: 95%;
}

#responsive_hot_deal .header {
  font-size: 16px;
  font-style: normal;
  color: #fff;
  font-weight: bold;
  background: #ce4451;
  padding-left: 8px;
  padding-top: 5px;
  padding-bottom: 5px;
}

#responsive_hot_deal .images {
  float: left;
  width: 28%;
}

#responsive_hot_deal .images .ship_image {
  padding: 5px 5px 0;
}

#responsive_hot_deal .cl_logo img {
  width: 100%;
  display: block;
  margin: 0 auto;
}

#responsive_hot_deal .images .ship_image img {
  width: 100%;
  border: #bdc3ca thin solid;
  box-sizing: border-box;
  display: block;
}

#responsive_hot_deal .cl_logo {
  width: 80%;
  margin: 0 auto;
}

#responsive_hot_deal .stats {
  float: left;
  width: 42%;
}

#responsive_hot_deal .stats .line {
  margin: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #ccc;
}

#responsive_hot_deal .stats .line .label {
  font-weight: bold;
  float: left;
}

#responsive_hot_deal .stats .line .answer {
  float: right;
}

#responsive_hot_deal .stats .line::after {
  content: '';
  display: block;
  clear: both;
}

.starting_price {
  text-align: center;
  margin: 15px 0;
}

#responsive_hot_deal .starting_price .price {
  color: red;
  font-weight: bold;
  font-size: 20px;
}

#responsive_hot_deal .right {
  float: right;
  width: 30%;
}

#responsive_hot_deal .bonus_text {
  color: #ff3048;
  padding: 11px;
  font-weight: bold;
  text-align: center;
}

#responsive_hot_deal .button_container {
  text-align: center;
  padding: 15px;
}

#responsive_hot_deal .button_container a {
  display: inline-block;
  padding: 5px 8px;
  font-weight: bold;
  color: white;
  background-color: #ff3048;
  border-radius: 4px;
  box-shadow: 0 2px 2px 0 #ccc;
  text-decoration: none;
}

#responsive_hot_deal .button_container a:hover {
  color: white;
  box-shadow: 0 3px 2px 0 #9a9a9a;
  background-color: #ac2031;
}

#responsive_hot_deal div.taxes_fees {
  font-size: 11px;
  margin: 3px;
}

h2.cruisesFromHdr,
h3.cruisesFromHdr {
  font-size: 17px !important;
  font-weight: bold;
  color: #033669;
  padding: 0 0 4px !important;
  margin: 0 !important;
}

p.cruisesFromSub {
  font-style: italic !important;
  font-size: 14px;
  margin-bottom: 10px !important;
}

.flex-row-span {
  flex: 0 0 100%;
}

p.cruisesFromAttraction {
  font-size: 15px;
  color: #056cd3;
  font-weight: bold;
  margin: 0 !important;
  padding: 0;
}

img.attractionPic {
  width: 270px;
  height: 180px;
  float: right;
  margin: 5px 0 5px 5px;
  border: 1px solid #ccc;
}

.port_link {
  font-size: 14px;
  color: #004a83;
  margin-top: 3px;
}

.filter .dropdown button.btn-default {
  width: -webkit-fill-available;
}

@media (width >= 650px) {
  div.mobile_tab_content_header {
    display: none;
  }
}

@media (width <= 649px) {
  div.mobile_tab_content_header {
    font-weight: bold;
    font-size: 20px;
    margin-bottom: 5px;
    color: #004a83;
  }
}

@media (width <= 1024px) {
  #searchDealsSideBar {
    left: -330px;
  }

  .search_slides_section {
    display: block;
  }

  .search_slides_section > .left #searchDealsSideBar {
    height: auto;
  }

  #main_search_box {
    width: 340px;
    margin-right: 0;
    border: 1px solid white;
  }
}

/* Six tabs at full size need about 1090 pixels; below that the labels and their padding shrink with the window. */
.adc_tabs {
  --adc-tab-font: clamp(14px, 1.75vw, 20px);
  --adc-tab-pad: clamp(6px, 1.2vw, 18px);
}

@media (width <= 720px) {
  #searchDealsSideBar {
    left: auto;
  }

  #filter_mobile {
    display: inline-block;
  }

  #normal_filters {
    display: none;
  }
}

@media (width <= 675px) {
  #responsive_hot_deal,
  #cruisesFromSale {
    width: 100%;
  }
}

@media (width <= 500px) {
  #responsive_hot_deal .images,
  #responsive_hot_deal .stats,
  #responsive_hot_deal .right {
    float: none;
    width: 100%;
  }

  #responsive_hot_deal .cl_logo {
    float: none;
  }

  #responsive_hot_deal div.taxes_fees {
    margin-top: 20px;
    text-align: center;
  }

  #responsive_hot_deal .button_container a {
    padding: 10px 11px;
  }
}
