/* Minification failed. Returning unminified contents.
(253,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(254,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(255,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(608,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(609,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(610,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(707,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(708,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(709,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
 */
/* ----------------------------------------------
   Home page
 * ---------------------------------------------- */
/*
   Planet cruise website variables
*/
/* --------------------------------------
    deals-list
-------------------------------------- */
.deals-list {
  width: 100%;
  padding: 4rem 0;
  background-color: #F3F5FB;
}
@media (max-width: 900px) {
  .deals-list {
    padding: 2rem 0;
  }
}
.deals-list .row__1200 {
  display: flex;
}
@media (max-width: 650px) {
  .deals-list .row__1200 {
    flex-wrap: wrap;
  }
}
.deals-list .generic-title {
  margin-bottom: 2rem;
}

.deals-list__col {
  width: 100%;
  background-color: white;
  padding: 48px 48px 24px 48px;
  margin: 1rem;
  -webkit-box-shadow: 0px 32px 32px 32px rgba(0, 0, 0, 0.01);
  -moz-box-shadow: 0px 32px 32px 32px rgba(0, 0, 0, 0.01);
  box-shadow: 0px 32px 32px 32px rgba(0, 0, 0, 0.01);
}
@media (max-width: 900px) {
  .deals-list__col {
    padding: 2rem;
    margin: 0.5rem;
  }
}
@media (max-width: 650px) {
  .deals-list__col {
    width: 100%;
    padding: 1rem;
    margin: 1rem;
  }
}
.deals-list__col h2 {
  padding: 0;
  margin: 0;
}
@media (min-width: 651px) {
  .deals-list__col:first-child {
    margin-left: 0;
  }
  .deals-list__col:last-child {
    margin-right: 0;
  }
}
.deals-list__col ul {
  list-style: none;
  padding: 0;
  margin: 1rem 0 0 0;
}
.deals-list__col ul li {
  margin: 0;
  padding: 0;
}
.deals-list__col ul li:first-child {
  border-top: 1px solid #f4f4f4;
}
.deals-list__col ul li > a {
  width: 100%;
  display: flex;
  text-decoration: none;
  color: #333;
  font-size: 16px;
  letter-spacing: 0.02em;
  padding: 1rem 1rem;
  border-bottom: 1px solid #f4f4f4;
}
.deals-list__col ul li > a:hover {
  text-decoration: none;
  background-color: #f9f9f9;
}
.deals-list__col ul li > a:hover .deals-list__arrow svg {
  fill: #c9005e;
  -webkit-animation: shake-horizontal 4s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
  animation: shake-horizontal 4s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
}
@media (max-width: 900px) {
  .deals-list__col ul li > a {
    font-size: 14px;
    padding: 1rem 1rem 1rem 0;
  }
}

.deals-list__content {
  width: 100%;
  padding-right: 0.5rem;
}

.deals-list__arrow {
  width: 20px;
  margin-right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.deals-list__arrow svg {
  width: 14px;
  max-width: 14px;
  fill: #ccc;
}

.deals-list__price {
  color: #c9005e;
  font-weight: 600;
}

.deals-list__title {
  font-weight: 600;
}

.deals-list__details > span {
  font-weight: 400;
  color: #666;
  width: 100%;
}

/*! CSS Used keyframes */
@-webkit-keyframes shake-horizontal {
  0%, 100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  10%, 30%, 50%, 70% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  20%, 40%, 60% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
  80% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  90% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
}
@keyframes shake-horizontal {
  0%, 100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  10%, 30%, 50%, 70% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  20%, 40%, 60% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
  80% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  90% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
}
/* ----------------------------------------------------------------------------
    PORTRAIT GRID

    This contains the style inside each CELL of the carousel
---------------------------------------------------------------------------- */
.portrait-grid {
  width: 100%;
}

/* CARD with link */
.portrait-card {
  height: 300px;
  display: block;
  background-color: #f9f9f9;
}
.portrait-card:hover {
  cursor: pointer;
}
.portrait-card:hover .portrait-card__img {
  transform: scale(1.3);
}
.portrait-card:hover .portrait-card__caption {
  opacity: 1;
}
.portrait-card:hover .portrait-card__title {
  text-decoration: none;
}

.portrait-card__overflow {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.portrait-card__caption {
  position: absolute;
  background: rgba(1, 1, 1, 0.8);
  color: #fff;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all 0.6s ease;
  text-align: center;
  font-size: 16px;
  padding-top: 100px;
  padding-left: 2rem;
  padding-right: 2rem;
  z-index: 2;
}

.portrait-card__img {
  max-width: 100%;
  height: 100%;
  transition: all 0.3s ease;
}

.portrait-card__title {
  width: 100%;
  font-size: 16px;
  text-align: center;
  color: #333;
  text-decoration: none;
  letter-spacing: 0.03em;
  font-weight: 400;
}

/* ----------------------------------------------------------------------------
    CAROUSEL FOR PORTRAIT GRID
---------------------------------------------------------------------------- */
.portraitcarousel-snapper {
  --slider-padding: 2rem;
  --slider-column-gap: 0.5rem;
  --slide-width: 206px;
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 2rem;
  padding-right: 2rem;
  position: relative;
}

.portraitcarousel-snapper__slider {
  display: block;
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}

.portraitcarousel-snapper__track {
  display: flex;
  position: relative;
}

/* ----------------------------------------------------------------------------
    CAROUSEL CELL STYLE
---------------------------------------------------------------------------- */
.carousel-portrait__cell {
  width: 206px;
  min-width: 206px;
  margin-right: 0.8rem;
}

/* 
    PRODUCT GRID
*/
.cruise-grid {
  width: 100%;
  padding: 4rem 0 2rem 0;
  /* GRID LIST */
}
.cruise-grid .ais-hits {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 0 0;
  padding: 0;
  justify-content: center;
  /* GRID ITEM */
}
.cruise-grid .ais-hits .ais-hits--item {
  list-style: none;
  width: 50%;
  padding: 0 2% 2% 2%;
  position: relative;
  /* Remove padding form the sides */
}
.cruise-grid .ais-hits .ais-hits--item:nth-child(1), .cruise-grid .ais-hits .ais-hits--item:nth-child(4), .cruise-grid .ais-hits .ais-hits--item:nth-child(5), .cruise-grid .ais-hits .ais-hits--item:nth-child(8), .cruise-grid .ais-hits .ais-hits--item:nth-child(9) {
  width: 40%;
  padding: 0 2% 2% 2%;
}
@media (max-width: 600px) {
  .cruise-grid .ais-hits .ais-hits--item {
    width: 100% !important;
  }
}

.cruise-grid__a {
  width: 100%;
  display: block;
  position: relative;
  background-color: #fff;
  text-decoration: none;
  color: #333;
  position: relative;
}
.cruise-grid__a:hover {
  text-decoration: none;
  color: #333;
}

/* Cruise image with overflow */
.cruise-grid__img {
  width: 100%;
  justify-content: center;
  text-align: center;
}
.cruise-grid__img img {
  display: block;
  max-width: 100%;
  margin: auto;
}

.cruise-grid__content {
  display: block;
  width: 100%;
  padding: 1rem 1rem 1rem 0;
  background-color: white;
}
.cruise-grid__content h4 {
  font-size: 18px;
  letter-spacing: 0.02em;
  line-height: 1.4;
  font-weight: 600;
  margin-top: 10px;
}
@media (max-width: 1020px) {
  .cruise-grid__content h4 {
    font-size: 14px;
  }
}

.cruise-grid__miniwrap {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
@media (max-width: 1100px) {
  .cruise-grid__miniwrap {
    flex-wrap: wrap;
  }
}
.cruise-grid__miniwrap i {
  color: #696969;
  font-size: 11px;
}

.cruise-grid__date {
  color: #696969;
  font-size: 14px;
  padding: 0 0.5rem 0 0;
}

.cruise-grid__nights {
  color: #696969;
  font-size: 14px;
  padding: 0 0.5rem 0 0.5rem;
}

.cruise-grid__price {
  font-size: 22px;
  margin-left: auto;
  font-weight: 800;
  color: #333;
  text-align: right;
  position: absolute;
  top: 30px;
  right: 20px;
  background-color: white;
  padding: 1rem;
  z-index: 1;
}
.cruise-grid__price small {
  font-size: 0.9rem;
}

.cruise-grid__deal-hits {
  width: 100%;
  padding: 1rem 0 3rem 0;
  display: flex;
  flex-wrap: wrap;
}

/* 
    FILTER UL
*/
.grid-filter {
  width: 100%;
}

.grid-filter__ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.grid-filter__ul li {
  margin: 0;
  padding: 0;
}
@media (max-width: 800px) {
  .grid-filter__ul li {
    width: 50%;
  }
  .grid-filter__ul .grid-filter__a {
    border: 1px solid #f4f4f4;
  }
  .grid-filter__ul .grid-filter__a .grid-filter__title, .grid-filter__ul .grid-filter__a .grid-filter__selection {
    font-size: 14px;
  }
}

.grid-filter__a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 1rem 2rem;
  margin: 0.5rem;
  border-radius: 50px;
  text-decoration: none;
}
.grid-filter__a.active {
  background-color: #f4f4f4;
  cursor: default;
}
.grid-filter__a:hover {
  text-decoration: none;
}

.grid-filter__title {
  color: #333;
  font-weight: 600;
  font-size: 16px;
  letter-spacing: 0.01em;
}

.grid-filter__selection {
  color: #333;
  text-align: center;
  font-size: 14px;
  display: block;
  margin-left: 10px;
  text-decoration: underline;
}

.grid-filter__content[data-filter-tab-status=visible] {
  display: block;
}
.grid-filter__content[data-filter-tab-status=hidden] {
  display: none;
}

.filter-options .ais-refinement-list--list {
  width: auto;
  white-space: nowrap;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0rem 1rem;
  margin-top: 1rem;
  margin-right: 2rem;
  font-weight: 400;
  cursor: pointer;
}
.filter-options .ais-refinement-list--label {
  text-align: left;
  font-size: 12px;
}
@media (max-width: 1000px) {
  .filter-options .ais-refinement-list--label {
    width: 150px;
  }
}
.filter-options .ais-refinement-list--item {
  margin-right: 1rem;
  margin-bottom: 0.5rem;
}
.filter-options .ais-refinement-list--count {
  display: none;
}

.cruise-lines-options {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  list-style: none;
}
.cruise-lines-options li {
  width: 20%;
  margin: 0;
  padding: 0;
}
@media (max-width: 1100px) {
  .cruise-lines-options li {
    width: 33%;
  }
}
@media (max-width: 800px) {
  .cruise-lines-options li {
    width: 50%;
  }
}

.cruise-lines-options__link {
  display: block;
  position: relative;
  padding: 2rem 4rem;
  margin: 1rem;
  text-decoration: none;
  background-color: white;
  border-top: #f4f4f4;
  -webkit-box-shadow: 0px 0px 21px -21px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 0px 21px -21px rgba(0, 0, 0, 0.75);
  box-shadow: 0px 0 21px -21px rgba(0, 0, 0, 0.75);
}
.cruise-lines-options__link img {
  width: 100%;
}
.cruise-lines-options__link p {
  width: 100%;
  text-decoration: none;
  margin: 1rem auto;
  text-align: center;
}
.cruise-lines-options__link:hover {
  text-decoration: none;
}

/* --------------------------------------
    Simple banners
-------------------------------------- */
.simplebanners {
  width: 100%;
  display: block;
  border: 1px solid white;
  margin-top: 4rem;
}
@media (max-width: 501px) {
  .simplebanners {
    display: none;
  }
}

.simplebanners__item {
  display: block;
  width: 100%;
  max-width: 741px;
  margin: 0rem 2rem 0rem 2rem;
  position: relative;
}

.simplebanners__link {
  width: 100%;
  display: block;
  position: relative;
}
.simplebanners__link img {
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* ----------------------------------------------------------------------------
    promotion banner CAROUSEL
---------------------------------------------------------------------------- */
.simplebanners-snapper {
  --slider-padding: 2rem;
  --slider-column-gap: 0.5rem;
  --slide-width: 741px;
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 2rem;
  padding-right: 2rem;
  position: relative;
}

.simplebanners-snapper__slider {
  display: block;
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}

.simplebanners-snapper__track {
  display: flex;
  position: relative;
}

/* --------------------------------------------------------
    CRUISE LINE LOGOS
    -------------------------------------------------------

    Currently used in:
    - home page
    - destination pages

-------------------------------------------------------- */
.cruise-lines {
  width: 100%;
  display: block;
  background-color: #ffffff;
  padding: 4rem 0;
  -webkit-box-shadow: 0px 0px 32px 32px rgba(0, 0, 0, 0.04);
  -moz-box-shadow: 0px 0px 32px 32px rgba(0, 0, 0, 0.04);
  box-shadow: 0px 0px 32px 32px rgba(0, 0, 0, 0.04);
}
.cruise-lines .row__1200 {
  display: flex;
}
@media (max-width: 900px) {
  .cruise-lines {
    padding: 2rem 0;
  }
}

.cruise-line__cell {
  display: block;
  padding: 1rem 1rem;
  margin: 1rem 1rem;
  margin-right: 1rem;
  text-align: center;
  color: #666;
}

.cruise-line__link {
  text-align: center;
  text-decoration: none;
}
.cruise-line__link p {
  font-size: 12px;
  font-style: italic;
  color: #333;
  text-decoration: none;
}
.cruise-line__link:hover {
  text-decoration: underline;
}
.cruise-line__link:hover p {
  color: #155d97;
  text-decoration: underline;
}

.cruise-line__cell__img {
  width: 206px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  text-decoration: none;
}
.cruise-line__cell__img img {
  max-width: 100%;
  margin-bottom: 0.5rem;
  max-height: 60px;
  text-decoration: none;
}

/* ----------------------------------------------------------------------------
    Destination carousel snapper
---------------------------------------------------------------------------- */
.cruise-line-snapper {
  --slider-padding: 2rem;
  --slider-column-gap: 0.5rem;
  --slide-width: 206px;
  display: block;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 2rem;
  padding-right: 2rem;
  position: relative;
}

.cruise-line-snapper__slider {
  display: block;
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 0 auto;
  position: relative;
}

.cruise-line-snapper__track {
  display: flex;
  position: relative;
}

/* Shared widgets*/
/* ------------------------ 
      GENERIC ACCORDION 
      currently used for Home page FAQ links.
    This is only for functionality, not for style 
  ------------------------ 
    https://jsfiddle.net/lucaguglielmi/szqgnuw3

    <ul class="accordion__wrapper">

<!-- accordion item --> 
  <li class="accordion-item">
    <button aria-expanded="false" class="accordion__button">
      <span class="accordion__title">Why is the moon sometimes out during the day?</span>
      <span class="accordion__icon" aria-hidden="true"></span>
    </button>

    <div class="accordion-content">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Elementum sagittis vitae et leo duis ut. Ut tortor pretium viverra suspendisse potenti.</p> 
    </div>
  </li>



<!-- accordion item --> 
  <li class="accordion-item">
    <button aria-expanded="false" class="accordion__button">
      <span class="accordion__title">Why is the moon sometimes out during the day?</span>
      <span class="accordion__icon" aria-hidden="true"></span>
    </button>

    <div class="accordion-content">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Elementum sagittis vitae et leo duis ut. Ut tortor pretium viverra suspendisse potenti.</p> 
    </div>
  </li>



<!-- accordion item --> 
  <li class="accordion-item">
    <button aria-expanded="false" class="accordion__button">
      <span class="accordion__title">Why is the moon sometimes out during the day?</span>
      <span class="accordion__icon" aria-hidden="true"></span>
    </button>

    <div class="accordion-content">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Elementum sagittis vitae et leo duis ut. Ut tortor pretium viverra suspendisse potenti.</p> 
    </div>
  </li>



<!-- accordion item --> 
  <li class="accordion-item">
    <button aria-expanded="false" class="accordion__button">
      <span class="accordion__title">Why is the moon sometimes out during the day?</span>
      <span class="accordion__icon" aria-hidden="true"></span>
    </button>

    <div class="accordion-content">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Elementum sagittis vitae et leo duis ut. Ut tortor pretium viverra suspendisse potenti.</p> 
    </div>
  </li>



<!-- accordion item --> 
  <li class="accordion-item">
    <button aria-expanded="false" class="accordion__button">
      <span class="accordion__title">Why is the moon sometimes out during the day?</span>
      <span class="accordion__icon" aria-hidden="true"></span>
    </button>

    <div class="accordion-content">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Elementum sagittis vitae et leo duis ut. Ut tortor pretium viverra suspendisse potenti.</p> 
    </div>
  </li>

<!-- accordion item --> 
  <li class="accordion-item">
    <button aria-expanded="false" class="accordion__button">
      <span class="accordion__title">Why is the moon sometimes out during the day?</span>
      <span class="accordion__icon" aria-hidden="true"></span>
    </button>

    <div class="accordion-content">
          <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Elementum sagittis vitae et leo duis ut. Ut tortor pretium viverra suspendisse potenti.</p> 
    </div>
  </li>
</ul>
*/
.accordion__wrapper {
  width: 100%;
  padding: 6rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* ITEMS */
.accordion-item {
  border-bottom: 1px solid #ccc;
}

.accordion__button {
  position: relative;
  display: block;
  text-align: left;
  width: 100%;
  padding: 1rem 0;
  font-size: 16px;
  font-weight: 400;
  border: none;
  background: none;
  outline: none;
  border-radius: 0;
}
.accordion__button:hover {
  cursor: pointer;
}
.accordion__button:hover::after {
  cursor: pointer;
}
.accordion__button:hover .accordion__title {
  padding: 1em 1.5em 1em 0;
  font-weight: 400;
}
.accordion__button .accordion__title {
  padding: 1em 1.5em 1em 0;
  color: #333;
}
@media (max-width: 900px) {
  .accordion__button .accordion__title {
    font-size: 16px;
  }
}
.accordion__button .accordion__icon {
  display: inline-block;
  position: absolute;
  top: 18px;
  right: 0;
  width: 22px;
  height: 22px;
  border-radius: 22px;
}
.accordion__button .accordion__icon::before {
  display: block;
  position: absolute;
  content: "";
  top: 9px;
  left: 5px;
  width: 10px;
  height: 2px;
  background: #333;
}
.accordion__button .accordion__icon::after {
  display: block;
  position: absolute;
  content: "";
  top: 5px;
  left: 9px;
  width: 2px;
  height: 10px;
  background: #333;
}

.accordion__button[aria-expanded=true] {
  font-weight: 400;
  color: black;
  border-bottom: 1px solid transparent;
}
.accordion__button[aria-expanded=true] .accordion__icon::after {
  width: 0;
}
.accordion__button[aria-expanded=true] + .accordion-content {
  padding: 2rem 0;
  opacity: 1;
  max-height: 100%;
  transition: all 200ms linear;
  will-change: opacity, max-height;
}

.accordion-content {
  padding: 0;
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
}

/* ----------------------------------------------------------------------
    FAQ WIDGET HOME PAGE
    THE REST OF THE css for FAQ is in _generic-accordion.scss
---------------------------------------------------------------------- */
.faq {
  background-color: #f4f4f4;
}
@media (max-width: 900px) {
  .faq {
    padding: 2rem 0;
  }
}

.faq__group {
  display: flex;
  margin-bottom: 3rem;
}
@media (max-width: 900px) {
  .faq__group {
    flex-wrap: wrap;
  }
}
.faq__group:first-child {
  margin-top: 0;
  padding-top: 4rem;
}
@media (max-width: 900px) {
  .faq__group:first-child {
    margin-top: 0rem;
    padding-top: 0rem;
  }
}
.faq__group:last-child {
  padding-bottom: 3rem;
  margin-bottom: 0;
}

.faq__group-title {
  width: 500px;
  min-width: 500px;
  padding: 1.5rem 0.5rem 0.5rem 0.5rem;
  margin-right: 1rem;
}
.faq__group-title h2 {
  font-size: 22px;
  margin-top: 0;
}
@media (max-width: 1100px) {
  .faq__group-title {
    width: 300px;
    min-width: 300px;
  }
}
@media (max-width: 900px) {
  .faq__group-title {
    width: 100%;
    min-width: 100%;
    padding-left: 0;
  }
  .faq__group-title h2 {
    font-size: 20px;
    font-weight: 600;
  }
}

/* --------------------------------------
    BLOG ARTICLE WIDGET HOME PAGE
-------------------------------------- */
.blog {
  width: 100%;
  display: block;
  margin: auto;
  margin-top: 4rem;
  padding-bottom: 2rem;
  text-align: center;
}

.blog__inner {
  width: 100%;
  display: flex;
  margin-top: 0rem;
  text-align: center;
  justify-content: center;
}
@media (max-width: 900px) {
  .blog__inner {
    flex-wrap: wrap;
  }
  .blog__inner .blog__intro {
    width: 100%;
    padding: 1rem 0 0 0;
    min-width: initial;
    text-align: center;
  }
  .blog__inner .blog__intro p {
    max-width: 500px;
    margin: auto;
  }
  .blog__inner .blog__list {
    max-width: 600px;
    margin: auto;
  }
}

.blog__intro {
  width: 500px;
  min-width: 500px;
  padding: 2rem 3rem 0 0;
  text-align: left;
}
@media (max-width: 900px) {
  .blog__intro {
    padding: 0 2rem 0rem 0;
  }
}
.blog__intro h2 {
  margin-bottom: 2rem;
}
.blog__intro p {
  line-height: 1.6;
}
@media (max-width: 1100px) {
  .blog__intro {
    width: 350px;
    min-width: 350px;
  }
  .blog__intro h2 {
    font-size: 20px;
    padding: 0px;
    margin: 0px;
  }
  .blog__intro p {
    padding: 0px;
    margin: 0px;
  }
}

.blog__list {
  width: 100%;
  padding: 2rem 0 0 0;
}
.blog__list ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
.blog__list li:first-child a {
  border-top: 1px solid #f4f4f4;
}

.blog__img {
  max-width: 190px;
  margin-right: 1rem;
}
@media (max-width: 900px) {
  .blog__img {
    max-width: 80px;
  }
}

.article__link {
  width: 100%;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #f4f4f4;
  padding: 10px 0;
  text-decoration: none;
}
.article__link:hover {
  text-decoration: none;
}
.article__link:hover .article__arrow-right svg {
  fill: #c9005e;
  -webkit-animation: shake-horizontal 4s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
  animation: shake-horizontal 4s cubic-bezier(0.455, 0.03, 0.515, 0.955) both;
}

.article__title {
  max-width: 400px;
  color: #333;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.03em;
  margin-left: 2rem;
  text-align: left;
  text-decoration: none;
}
.article__title:hover {
  text-decoration: underline;
}
@media (max-width: 900px) {
  .article__title {
    font-size: 14px;
  }
}

.article__arrow-right {
  margin-left: auto;
  width: 20px;
  margin-right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.article__arrow-right svg {
  width: 14px;
  max-width: 14px;
  fill: #ccc;
}

/* --------------------------------------
    TRUSTPILOT TESTIMONIALS HOMEPAGE
-------------------------------------- */
.testimonials__wrapper {
  width: 100%;
  background-color: #F3F5FB;
  padding: 4rem 0 2rem 0;
  text-align: center;
}
@media (max-width: 900px) {
  .testimonials__wrapper {
    padding: 2rem 0;
  }
}

.two-testimonials {
  width: 100%;
  display: flex;
  margin-top: 2rem;
  margin-bottom: 2rem;
}
@media (max-width: 900px) {
  .two-testimonials {
    flex-wrap: wrap;
    margin-bottom: 1rem;
  }
}
.two-testimonials .two-testimonials__cell:first-child {
  margin-left: 0;
  margin-right: 2rem;
}
.two-testimonials .two-testimonials__cell:last-child {
  margin-left: 2rem;
  margin-right: 0;
}

.two-testimonials__cell {
  width: 50%;
  background-color: white;
  padding: 1.5rem;
  text-align: left;
}
@media (max-width: 900px) {
  .two-testimonials__cell {
    width: 100%;
    margin: 0 0 1rem 0 !important;
  }
}

.two-testimonials__stars .fa-star {
  color: #faae3c;
}
.two-testimonials__stars .fa-star-o {
  color: #dce4ed;
}

.trustpilot-stars img {
  display: none;
  margin: auto;
}

.trustpilot-stars[data-trust-stars="4"] .trustpilot-img4 {
  display: block;
}

.trustpilot-stars[data-trust-stars="4.5"] .trustpilot-img45 {
  display: block;
}

.trustpilot-stars[data-trust-stars="5"] .trustpilot-img5 {
  display: block;
}