@import url('https://cdnjs.cloudflare.com/ajax/libs/material-design-icons/3.0.1/iconfont/material-icons.min.css');

@font-face {
  font-family: latam-interaction;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b12f3289871_latam-interaction.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Regular-Italic;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b12ce9d6a61_latam-sans-regular-italic.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Regular;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b12b5fcc4a1_latam-sans-regular.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Light-Italic;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b129961dbc4_latam-sans-light-italic.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Light;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b129961dbc4_latam-sans-light-italic.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Hairline-Italic;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b1269fa1608_latam-sans-hairline-italic.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Hairline;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b105092f18e_latam-sans-hairline.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Extended;
  src: url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b103015a390_latam-sans-extended.ttf)
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Bold-Italic;
  src:
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b1016328f63_latam-sans-bold-italic.woff2)
      format('woff2'),
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b10067b7263_latam-sans-bold-italic.ttf)
      format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Bold;
  src:
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b0ffcfe214a_latam-sans-bold.woff2)
      format('woff2'),
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b0fed78a0ae_latam-sans-bold.ttf)
      format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Black-Italic;
  src:
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b0fe1de6e3f_latam-sans-black-italic.woff2)
      format('woff2'),
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b0fcf255fc9_latam-sans-black-italic.ttf)
      format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: Latam-Sans-Black;
  src:
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60b0fc8b467c2_latam-sans-black.woff2)
      format('woff2'),
    url(https://d3rwujusajfqlr.cloudfront.net/uploads/60aeb851bcf77_latam-sans-black.ttf)
      format('truetype');
  font-weight: 400;
  font-style: normal;
}

a {
  text-decoration: none;
  &:hover {
    text-decoration: none;
  }
}

body {
  background-color: #f5f5f5;
}

.travel-container {
  display: flex;
  flex-direction: column;
  max-width: 1366px;
  margin: 0 auto;
  margin-top: 64px;
}

.travel-container h3 {
  color: #0f004f;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 40px;
}

.travel-cards-container  {
  padding-bottom: 16px;
}

.travel-cards-container .travel-card {
  height: 156px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 8px;
  background: #fff;
  border: none;
  box-shadow:
    0px 4px 6px -1px rgba(0, 0, 0, 0.1),
    0px 2px 4px -1px rgba(0, 0, 0, 0.06);
}


.travel-cards-container .travel-content {
  margin-top: auto;
}

.travel-cards-container .travel-card p {
  padding: 0;
  margin: 0;
  color: #171717;
  font-weight: 600;
  line-height: 150%;
  font-size: 16px;
  font-family: Latam-Sans-Bold, sans-serif;
  letter-spacing: 0px;
  align-content: flex-end;
}

.travel-cards-container .travel-card strong {
  color: #CD1043;
  font-weight: 600;
  line-height: 20px;
  font-size: 14px;
  font-family: Latam-Sans-Bold, sans-serif;
}

.travel-card {
  min-width: 169px;
  transform: scale(1);
  transition: all 500ms;
  &:hover {
    transform: scale(1.08);
  }
}

.select-container {
  width: 20.5rem;
  position: relative;
}

.select-container select {
  width: 100%;
  height: 56px;
  border-radius: 8px;
  border: 1px solid #5C5C5C;
  padding: 0px 16px;
  cursor: pointer;
  -webkit-appearance: none;
  font-family: Latam-Sans-Regular, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #303030;
  line-height: 24px;
  background-color: #F5F5F5;
}

.select-container .label {
  color: #5C5C5C;
  font-family: Latam-Sans-Regular, sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: 18px;
  background-color: blue;
  margin-top: -100px;
  padding: 0px 8px;
  background-color: #F5F5F5;
  position: relative;
  top: -72px;
  left: 12px;
}

.select-container .icon {
  position: absolute;
  right: 16px;
  top: 20px;
  pointer-events: none;
}

.default-container {
  background-color: #EEEDF9;
}

.default-container h2 {
  font-family: Latam-Sans-Bold, sans-serif;
  font-weight: 600;
  font-size: 20px;
  line-height: 150%;
  color: #000;
}

.default-container p {
  font-size: 16px;
  line-height: 150%;
  font-family: Latam-Sans-Regular, sans-serif;
  color: #000;
}

@media (max-width: 768px) {

  .travel-cards-container .travel-card {
    width: 100%;
  }

  .travel-container {
    padding: 24px;
  }
  .travel-cards-container {
    padding: 8px 0 24px 0;
    gap: 32px;
  }
}