@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&display=swap');

body {
    font-family: "Rubik", sans-serif;
}

header {
    position: relative;
    background-image: url('https://i.imgur.com/CfFPE0H.png');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

header::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 20%;  /* This makes the gradient cover only 20% from the bottom */
    background: linear-gradient(to top, rgb(19,19,19) 0%, rgba(19,19,19,0) 100%);
    pointer-events: none;
}

.render-image {
    height: 200px;
    object-fit: cover;
    margin-right: 5%;
  }

  .render-image-left {
    height: 200px;
    object-fit: cover;
    margin-left: 5%;
  }