@import '~styles/settings.scss';

.homeBg {
  background-color: $white;
}

.video {
  height: 440px;
  width: 100%;
  background-color: black;
}

:global .react-player__play-icon {
  border-width: 4px 0 4px 8px !important;
  border-color: transparent transparent transparent #0a1941 !important;
  margin-left: 4px !important;

  &::after {
    content: 'Learn more about why we built Climate Watch and how it can help you.';
    position: absolute;
    color: $white;
    font-size: 16px;
    bottom: -50px;
    left: -222px;
    width: 491px;
  }
}

:global .react-player__shadow {
  background: none !important;
  width: 54px !important;
  height: 54px !important;
  background-color: #ffc735 !important;
  position: relative;
}

@import '~styles/settings.scss';

.homeBg {
  background-color: $white;
}

.video {
  height: 440px;
  width: 100%;
  background-color: black;
}

:global .react-player__play-icon {
  border-width: 4px 0 4px 8px !important;
  border-color: transparent transparent transparent #0a1941 !important;
  margin-left: 4px !important;
}

:global .react-player__preview {
  position: relative;
  &::after {
    content: 'Learn more about why we built Climate Watch and how it can help you.';
    position: absolute;
    color: $white;
    font-size: 16px;
    top: 60%;
    text-align: center;
    width: 80%;
  }
}

:global .react-player__shadow {
  background: none !important;
  width: 54px !important;
  height: 54px !important;
  background-color: #ffc735 !important;
  position: relative;
}

Make description in video player section responsive
Make description in video player section responsive
