:root {
  --color-primary: #002D72;
  --color-blue-2: #00549D;
  --color-secondary: #fe6d73;
  --color-tertiary: #F7CC83;
  --color-text: oklch(37.3% 0.034 259.733);
  --color-heading: oklch(21% 0.034 264.665);
  --color-golden-1: $color-tertiary;
  --color-golden-2: #FFAF26;
  --color-border: #e7e7ed;
  --font-size-section-heading: 34px; }

.medias-container .media-wrapper {
  text-decoration: none;
  width: 100%; }
  .medias-container .media-wrapper:hover .media-title {
    color: #fe6d73 !important; }

.medias-container .youtube-video {
  padding-top: calc(56.25%);
  position: relative;
  width: 100%; }
  .medias-container .youtube-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }

.medias-container .media-details {
  min-height: 90px;
  padding: 12px;
  width: 100%; }

.medias-container .large .youtube-video {
  padding-top: calc(56.25% / 2);
  position: relative;
  width: 50%; }

.medias-container .large .media-details {
  margin-left: 10px;
  padding: 16px;
  width: calc(50% - 10px); }

.media-wrapper {
  border: 1px solid var(--color-border);
  position: relative;
  padding-bottom: 40px;
  border-radius: 5px; }

.media-card-bottom {
  border-top: 1px solid #f3f3f6;
  padding-top: 10px;
  padding-bottom: 10px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0; }

.media-img-wrapper {
  padding-top: 56.25%;
  position: relative;
  width: 100%; }

.media-img-wrapper img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: 0.2s all ease-in;
  border-radius: 5px; }

.media-img-wrapper:hover img {
  filter: brightness(0.75); }

@media screen and (max-width: 767px) {
  .large .media-wrapper {
    flex-direction: column; }
    .large .media-wrapper .youtube-video {
      padding-top: calc(56.25%);
      width: 100%; }
    .large .media-wrapper .media-details {
      margin-left: 0;
      width: 100%; } }
