body,
html {
  position: relative;
  height: 100%;
  background: url("/images/shutterstock_28988224.jpg");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  overflow-x: hidden;
  font-family: Montserrat !important;
}

body .tlc__logo,
html .tlc__logo {
  position: relative;
  top: -6px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  -webkit-animation-name: showLogo;
  animation-name: showLogo;
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
}

body .tlc__logo > img,
html .tlc__logo > img {
  max-width: 250px;
  max-height: 306px;
  width: 100%;
}

@-webkit-keyframes showLogo {
  0% {
    top: -295px;
  }
  100% {
    top: -6px;
  }
}

@keyframes showLogo {
  0% {
    top: -295px;
  }
  100% {
    top: -6px;
  }
}

body .logistics__gift,
html .logistics__gift {
  margin: 0;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

body .logistics__gift .block__shadow,
html .logistics__gift .block__shadow {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  max-width: 315px;
  width: 100%;
  height: 50px;
  background-color: rgba(255, 255, 255, 0.7);
}

body .logistics__gift .block__shadow .logo,
html .logistics__gift .block__shadow .logo {
  padding: 0;
  position: relative;
  top: -36px;
  left: 12px;
}

body .logistics__gift .block__shadow .text__logistics,
html .logistics__gift .block__shadow .text__logistics {
  padding: 0;
  color: #089e7e;
  font-size: 17px;
  font-weight: bold;
  text-transform: uppercase;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  text-align: center;
  white-space: nowrap;
}

body .logistics__gift .block__shadow .btn__logistics,
html .logistics__gift .block__shadow .btn__logistics {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

body .logistics__gift .block__shadow .btn__logistics > button,
html .logistics__gift .block__shadow .btn__logistics > button {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background: #ed2023;
  border: none;
  border-radius: 10px;
  width: 100%;
  height: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

body .logistics__gift .block__shadow .btn__logistics > button > img,
html .logistics__gift .block__shadow .btn__logistics > button > img {
  width: 27px;
}

body .logistics__gift .log,
html .logistics__gift .log {
  padding: 20px;
  -webkit-animation-name: showLog;
  animation-name: showLog;
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
}

@-webkit-keyframes showLog {
  0% {
    left: -518px;
  }
  100% {
    left: 0;
  }
}

@keyframes showLog {
  0% {
    left: -518px;
  }
  100% {
    left: 0;
  }
}

body .logistics__gift .log .logistics,
html .logistics__gift .log .logistics {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

body .logistics__gift .log .logistics > img,
html .logistics__gift .log .logistics > img {
  max-width: 315px;
  max-height: 225px;
  width: 100%;
}

@media screen and (max-width: 414px) {
  body .tlc__logo > img,
  html .tlc__logo > img {
    max-width: 150px;
    max-height: 150px;
  }
  body .logistics__gift .log .logistics > img,
  html .logistics__gift .log .logistics > img {
    max-width: 140px;
    max-height: 150px;
  }
  body .logistics__gift .log .logistics .block__shadow,
  html .logistics__gift .log .logistics .block__shadow {
    max-width: 140px;
    width: 100%;
    height: 30px;
    background-color: rgba(255, 255, 255, 0.7);
  }
  body .logistics__gift .log .logistics .block__shadow .logo,
  html .logistics__gift .log .logistics .block__shadow .logo {
    padding: 0;
    position: relative;
    top: -26px;
    left: 8px;
  }
  body .logistics__gift .log .logistics .block__shadow .logo > img,
  html .logistics__gift .log .logistics .block__shadow .logo > img {
    max-width: 50px;
  }
  body .logistics__gift .log .logistics .block__shadow .text__logistics,
  html .logistics__gift .log .logistics .block__shadow .text__logistics {
    font-size: 12px;
    margin-right: 10px;
  }
  body .logistics__gift .log .logistics .block__shadow .btn__logistics,
  html .logistics__gift .log .logistics .block__shadow .btn__logistics {
    /* -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; */
    display: none;
  }
}

body .logistics__gift .gif,
html .logistics__gift .gif {
  padding: 20px;
  -webkit-animation-name: showGif;
  animation-name: showGif;
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
}

@-webkit-keyframes showGif {
  0% {
    right: -518px;
  }
  100% {
    right: 0;
  }
}

@keyframes showGif {
  0% {
    right: -518px;
  }
  100% {
    right: 0;
  }
}

body .logistics__gift .gif .gift,
html .logistics__gift .gif .gift {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

body .logistics__gift .gif .gift > img,
html .logistics__gift .gif .gift > img {
  max-width: 315px;
  width: 100%;
  max-height: 225px;
}

@media screen and (max-width: 414px) {
  body .logistics__gift .gif .gift > img,
  html .logistics__gift .gif .gift > img {
    max-width: 140px;
    max-height: 150px;
  }
  body .logistics__gift .gif .gift .block__shadow,
  html .logistics__gift .gif .gift .block__shadow {
    max-width: 140px;
    width: 100%;
    height: 30px;
    background-color: rgba(255, 255, 255, 0.7);
  }
  body .logistics__gift .gif .gift .block__shadow .logo,
  html .logistics__gift .gif .gift .block__shadow .logo {
    padding: 0;
    position: relative;
    top: -26px;
    left: 8px;
  }
  body .logistics__gift .gif .gift .block__shadow .logo > img,
  html .logistics__gift .gif .gift .block__shadow .logo > img {
    max-width: 50px;
  }
  body .logistics__gift .gif .gift .block__shadow .text__logistics,
  html .logistics__gift .gif .gift .block__shadow .text__logistics {
    font-size: 12px;
    margin-right: 10px;
  }
  body .logistics__gift .gif .gift .block__shadow .btn__logistics,
  html .logistics__gift .gif .gift .block__shadow .btn__logistics {
    /* -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; */
    display: none;
  }
}

body .hotline,
html .hotline {
  position: relative;
  color: #ed2023;
  background: rgba(255, 255, 255, 0.7);
  font-weight: 700;
  font-size: 21px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 10px;
  width: 100%;
  max-width: 796px;
  margin: auto;
  /* border-top: 1px solid #fff; */
  -webkit-animation-name: fadeHotline;
  animation-name: fadeHotline;
  -webkit-animation-duration: 6s;
  animation-duration: 6s;
}

@-webkit-keyframes fadeHotline {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes fadeHotline {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}