@media only screen and (max-width: 1200px) {
  
}

@media only screen and (max-width: 992px) {
  
  .About {
    column-gap: 1rem;
  }

  .Projects_Gallery{ 
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;
  }

}

@media only screen and (max-width: 768px) {
    
    .nav_links {
        display: none;
    }

    .menu_btn {
        background-color: transparent;
        border: none;
        cursor: pointer;
        display: flex;
        justify-self: end;
        padding-bottom: 5px;
        z-index: 5;
    }

    .menu_btn svg  {
        width: 48px;
        height: 48px;
    }

    .line {
        fill: none;
        stroke: var(--clr-primary-5);
        stroke-width: 5;
        transition: stroke-dasharray 600ms cubic-bezier(0.4, 0, 0.2, 1),
        stroke-dashoffset 600ms cubic-bezier(0.4, 0, 0.2, 1);
      }

    .line1 {
        stroke-dasharray: 60 207;
        stroke-width: 5;
      }

    .line2 {
        stroke-dasharray: 60 60;
        stroke-width: 5;
      }

    .line3 {
        stroke-dasharray: 60 207;
        stroke-width: 5;
      }
    .opened .line1 {
        stroke-dasharray: 90 207;
        stroke-dashoffset: -134;
        stroke-width: 5;
      }
    .opened .line2 {
        stroke-dasharray: 1 60;
        stroke-dashoffset: -30;
        stroke-width: 5;
      }
    .opened .line3 {
        stroke-dasharray: 90 207;
        stroke-dashoffset: -134;
        stroke-width: 5;
      }

    .menu_btn[aria-expanded='true'] + .nav_menu2 {
    
      visibility:visible;
    }

    .menu_btn[aria-expanded='true'] + .nav_menu2 .nav_overlay {
      transform: scale(1);
      transition-duration: var(--menu-speed);
    }

    .menu_btn[aria-expanded='true'] + .nav_menu2 .nav_overlay div {
      opacity: 1;
      transition:  opacity 0.4s ease 0.4s;
    }

    .Hero_content {
      min-height: calc(100vh - 4.5rem);
      display: grid;
      place-items: center;
      grid-template-columns: auto;
      }

      .Hero_image {
        display: none;
      }

      .About {
        display: grid;
        place-items: center;
        grid-template-columns: auto;
        column-gap: normal;
        row-gap: 3rem;}

        .about_image::before {
          display: none;
        }

        .Skills_container {
          display: grid;
          grid-template-columns: auto;
          gap: 2rem;
      }

    }

@media only screen and (max-width: 576px) {
  .Footer_Container ul {
    gap: 1rem;
}

.Footer_Container p {
    font-size: 14px;
}
}





@media only screen and (min-width: 769px) {
  .nav_items h3 {
    align-self: end;
  }

}



@media only screen and (min-width: 993px) {
  .Project-1 {
    grid-area: a;
  }

  .Project-2 {
    grid-area: b;
  }

  .Project-3 {
    grid-area: c;
  }

  .Project-4 {
    grid-area: d;
  }

  .Projects_Gallery{ 
    display: grid;
    grid-template-rows: 200px 200px;
    grid-template-areas: 
    "a b b"
    "a c d";
    gap: 2rem;
  }

  .Projects_Gallery_img {
    height: 100%;
  }

  .Projects_image {
    height: 100%;
  }
}



@media only screen and (min-width: 1201px) {
  .Cards_Container {
    grid-template-columns: repeat(auto-fill , minmax(270px, 1fr));
  }
  .card__Title p{
    margin-bottom: 0;
  }
}