.submenu-all {
    background: linear-gradient(90deg, #4e366c55, #8262b0c1, #3b4ee5ea);
    backdrop-filter: blur(11.4px);
    -webkit-backdrop-filter: blur(11.4px);
    border: 1px solid rgba(133, 9, 235, 0.31);
    border-radius: 10px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    display: none;
    position: absolute;
    min-width: 180px;
  }

  .submenu-all li {
    border-radius: 10px;
    padding: 5px 10px;
    text-align: right;
  }

  .submenu-all a {
    color: white;
    display: inline-block;
    border-radius: 10px;
    width: 100%;
    /*  بدون این قانون ها هم یک مدل
     ساب منو دیگر خواهیم داشت! */
  }

  /*   .submenu>li>a:hover {
    background-color: #e4d9ea60; 
  } */

  nav>ul>li:hover>.submenu {
    display: block;
  }

  /*تمامی ساب های داخلی رده دومی*/
  .submenu>li>a:hover+.submenu-2-all,
  /* روی خودش هم که کرسر رفت این قانون اعمال بشه */
  .submenu-2-all:hover,
  /*تمامی ساب های داخلی رده سومی*/
  .submenu-2-all>li>a:hover+.submenu-3-all,
  /* روی خودش هم که کرسر رفت این قانون اعمال بشه */
  .submenu-3-all:hover,
   /*تمامی ساب های داخلی رده چهارمی*/
  .submenu-3-all>li>a:hover+.submenu-4-all,
  /* روی خودش هم که کرسر رفت این قانون اعمال بشه */
  .submenu-4-all:hover {
    display: inline-block;
  }

  /*تمامی ساب های داخلی رده سومی*/
  .submenu-2-all>li>a:hover+.submenu-3-all,
  /* روی خودش هم که کرسر رفت این قانون اعمال بشه */
  .submenu-3-all:hover {
    font-size: 11.5px;
  }

  .submenu>li>a:hover+#submenu-2-Designs,
  #submenu-2-Designs:hover {
    left: 50%;
    top: 37%;
  }

    #submenu-2-Designs>li>a:hover+#submenu-3-AskHub,
  #submenu-3-AskHub:hover {
    left: 50%;
    top: 40%;
  }

    #submenu-3-AskHub>li>a:hover+#submenu-4-Start,
  #submenu-4-Start:hover {
    left: 70%;
    top: 75%;
  }

  .submenu>li>a:hover+#submenu-2-Homeworks,
  #submenu-2-Homeworks:hover {
    left: 34%;
    top: 90%;
  }

  #submenu-2-Homeworks>li>a:hover+#submenu-3-HTML,
  #submenu-3-HTML:hover {
    left: 57%;
    top: 27%;
  }

  #submenu-2-Homeworks>li>a:hover+#submenu-3-CSS,
  #submenu-3-CSS:hover {
    left: 68%;
    top: 60%;
  }

  #submenu-2-Homeworks>li>a:hover+#submenu-3-JS,
  #submenu-3-JS:hover {
    left: 73%;
    top: 92%;
  }