.fourwrap {background-color: #f2f2f2; padding: 3rem 0rem 0rem 0rem;}

.fourwrap a.arrow-link.white:hover {
  text-decoration: underline;
  text-underline-offset: 5px;
}
p.desc.showme {
  max-width: 8%;
  font-size: 16px;
}

.showme {
  display: none;
}

.showhim:hover .showme,
.showhim:focus-within .showme {
  display: block;
}

.threewrap{padding:0px!important;}

.gradient {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ebeff5+100 */
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top,  #ffffff 0%, #ebeff5 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #ffffff 0%,#ebeff5 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #ffffff 0%,#ebeff5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ebeff5',GradientType=0 ); /* IE6-9 */
}
.recommendations-wrapper {
  margin:auto;
  padding:0;
  grid-template-columns: repeat(4,1fr);
  grid-row-gap: 0;
  display: grid;
  grid-column-gap: 0;
  background-color:#fff;
  transition:0.3s;
  overflow:hidden;
}
.single-recommendation {
  background-color: #000;
  min-height: 550px;
  position: relative;
  background-size: cover!important;
  background-repeat: no-repeat!important;
  transition: 0.3s;
  background-position: center!important;
}
.bottom-alignment {
  width: 1000%;
  position:absolute;
  bottom:0;
  padding: 2em;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+98,000000+100&0+0,0.9+100 */
  /*background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.88) 98%, rgba(0,0,0,0.9) 100%); /* FF3.6-15 */
  /*background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.88) 98%,rgba(0,0,0,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
  /*background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.88) 98%,rgba(0,0,0,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#e6000000',GradientType=0 ); /* IE6-9 */
  background: linear-gradient(to bottom, transparent 0%, black 66%, black 100%);
}
.single-recommendation h3,
.single-recommendation .desc {
  color:#fff;
  margin: .75rem 0;
}
.single-recommendation p.eyebrow {
  margin: 0;
  background-color: #CF4234;
  font-weight: 600;
  text-transform: uppercase;
  font-size: .75rem;
  color:#fff;
  display: inline-block;
  padding: .15rem .5rem;
}
.single-recommendation p.title {
  margin:0;
  color:#fff;
}
.recommendations-wrapper:hover .single-recommendation,
.recommendations-wrapper:focus-within .single-recommendation {
  opacity:0.3;
}
.recommendations-wrapper:hover .single-recommendation:hover,
.recommendations-wrapper:focus-within .single-recommendation:focus-within {
  opacity:1;
}
.recommendations-wrapper:hover .single-recommendation:hover a.arrow-link.white,
.single-recommendation:focus-within a.arrow-link.white {
  color: ;
}
.recommendations-wrapper:hover .single-recommendation:hover a.arrow-link.white:after,
.single-recommendation:focus-within a.arrow-link.white:after {
  content: url("https://info.inteletravel.com/hubfs/InT_ArrowLink_Icon_White.svg");
  transform: translate(5px, 0);
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  filter: gray;
}



/*pre-footer*/
.pre-footer-cta-3 { 
  background-color: #dedede;
  padding-bottom: 4rem;
  padding-top: 3rem;
}
@media (max-width: 1160px) {
  .recommendations-wrapper {
    grid-template-columns: repeat(2,1fr);
  }

  p.desc.showme {
    /*max-width: 23em;*/
  }
}
@media (max-width: 960px) {

  p.desc.showme {
    /* max-width: 17em;*/
  }

}

@media (max-width: 768px) {
  .recommendations-wrapper {
    grid-template-columns: none;
  }
  .showme {
    display: block;
  }
  p.desc.showme {
    /*max-width: 7%;*/
  }
}
