@media screen and (min-width: 600px) {
  
  .mobile {
    display: none;
  }
  
  header {
    position: fixed;
    right: 0;
    width: 150px;
    padding: 50px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    /* display: none; */
    pointer-events: none;
  }
  .menu {
    display: flex;
    height: 100vh;
    overflow-x: hidden; /* prevent horizontal scroll */

  }

  .text-menu {
    height: 100vh;
    overflow: scroll;
    position: relative;
  }

  .text-wrapper {
    /* -webkit-mask-image: -webkit-gradient(linear, left 20%, 
    left 30%, from(rgb(173, 7, 7)), to(rgb(255, 255, 255,1))); */
    padding-bottom: 70%;
  }
.blur {
  position: fixed;
  top: 0px;
  width: 60%;
  height: 100%;
  backdrop-filter: blur(10px);
  transform: translateY(20%);
  pointer-events: none;
  -webkit-mask: -webkit-gradient(
    linear,
    left 20%,
    left 0%,
    from(rgba(0, 0, 0, 1)),
    to(rgba(0, 0, 0, 0))
  );
  /* z-index: 2; */
}


.text-fields {
  height: 30vh;
  display: grid;
  /* grid of 2 columns and 2 rows */
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  /* width based on the minimum width of contents */
  width: fit-content;
}

  .text-fields>* {
   font-size: 1rem; 
   font-family: sans-serif;
   font-style: italic;
   font-weight: 600;
   margin: 0;
  }
  .text-fields :nth-child(1) {
    
  }

  .text-fields :nth-child(2) {
    font-size: 5rem;
    order: 3;
    /* take two columns in size */
    grid-column: span 2;
    font-family: ginto nord;
    font-style: normal;
  }

  .text-fields :nth-child(3) {
    justify-self: end;
  }


  .main-image {
    width: 30vw;
    height: 70vh;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
    transition: transform 0.3s;
  }

  .text-menu {
    width: 60%;
  }

  .image-menu {
    width: 40%;
    height: 100vh;
    overflow: scroll;
  }
    /* Hide scrollbar for Chrome, Safari and Opera */
    .image-menu::-webkit-scrollbar,.text-menu::-webkit-scrollbar {
      display: none;
    }
    
    /* Hide scrollbar for IE, Edge and Firefox */
    .image-menu,.text-menu {
      -ms-overflow-style: none;  /* IE and Edge */
      scrollbar-width: none;  /* Firefox */
    }
}
