body {
    background-color: rgb(134, 133, 226);
  }
  h1 {
    color: black;
  }
  p {
    color: rgb(0, 0, 0);
  }


@font-face {
    font-family: "acer";
    src: url("/_site/fonts/Web437_Acer710_Mono.woff") format('woff'),
         url("/_site\fonts\Px437_Acer710_Mono.ttf") format('ttf');
}

a:link {
    color: rgb(54, 31, 146);
    background-color: transparent;
    text-decoration: none;
  }
  
  a:visited {
    color: rgb(54, 31, 146);;
    background-color: transparent;
    text-decoration: none;
  }
  
  a:hover {
    color: pink;
    background-color: transparent;
    text-decoration: underline;
  }
  
  a:active {
    color: pink;
    background-color: transparent;
    text-decoration: underline;
  }


  .wrapper {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    gap: 10px;
    grid-auto-rows: minmax(100px,auto);
    grid-template-areas:
      "a x"
      "b c"
      "d e";
    align-items: start;
  }


  @media (max-width: 768px) {
    .wrapper {
      grid-template-columns: repeat(2, 1fr);
      grid-template-areas:
        "a x"
        "c x"
        "e x"
    }
  }




.text{
grid-area: c;
}

.text2{
  grid-area: e;
}
.back_arrow {
    grid-area: a;
    padding-left: 25px;
  }

img {
  max-width: 100%;
  height: auto;
}