:root {
  --sub_color: #000;
  --sub_bg: #fff;
}

nav:has(#ros__nav_1) {
  top: 0rem;
  box-shadow: -2px 2px 20px #00000042;
  transition: 0.5s;
  background-color: var(--nav_1_style_2_b);
  position: relative;
  z-index: 99;
}

nav.quick__view_nav_1:has(#ros__nav_1) {
  position: fixed;
  left: 2.5%;
  top: 2px;
  margin-bottom: 2rem;
  width: 95%;
  padding: 5px 2rem;
  border-radius: 13px;
  backdrop-filter: blur(10px);
  background: #ffffff5e;
  z-index: 9;

  & #ros__nav_1 {
    background: transparent !important;
    width: unset !important;
  }
}

.out__off_QuickInfo {
  background: #fff !important;
  top: -5px !important;
  transform: translate(-50%, 0px) !important;
  width: 100% !important;
  border-radius: 0 !important;
}

.navbar-menu {
  & > li {
    .sub-menu {
      top: 82% !important;

      & li {
                & .sub-menu {
                                      margin: -20px -6px 0 -7px !important;
                }}
    }
  }
}

section#ros__nav_1 {
  max-width: var(--premary_width);
  margin: 0 auto;
  padding: 10px 7px 0;
  background-color: var(--nav_1_style_2_b);

  & * {
    font-family: "Inria Sans", sans-serif;
    font-weight: bold;
    font-size: 14px;
    color: var(--nav_1_style_2_c);
    fill: var(--nav_1_style_2_c);
  }

  & .navbar-menu {
    transform: translate(-10px, 0px);
  }

  & ul.menu-contect {
    & li:before {
      background: #00000026;
    }
  }

  & .rosBox__Top {
    align-items: center;
    border-bottom: 1px solid #a3a3a3;
    padding-bottom: 7px;

    & .logo {
      & img {
        width: 10rem;
        object-fit: contain;
      }
    }

    & .contectMenu {
      & ul {
        gap: 10px;

        & li {
          font-size: 12px;

          & a {
            font-weight: bold;
            font-size: 12px;
          }
        }
      }
    }
  }

  & .rosBox__Bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 40px;
    position: relative;

    & .menuOption {
      gap: 10px;
    }

    & ul {
      gap: 5px;

      & > li {
        .sub-menu {
          z-index: 99;
          box-shadow: 3px 3px 0px #0000002e;
          background: var(--nav_1_style_2_b);
        }
      }
    }
  }
}

/* Search In Style 2 */
#Serch__Style {
  &.Open__Serch {
    right: 1rem;
    top: 0;
  }
}

/*  */
@media (max-width: 576px) {
  section#ros__nav_1:has(.rosBox__Bottom) {
    display: flex;
    justify-content: space-between;

    & .rosBox__Top {
      justify-content: center;
      border-bottom: none !important;

      & .contectMenu {
        display: none;
      }
    }

    & .rosBox__Bottom {
      & .navbar-menu {
        display: none;
      }
    }
  }

  #Serch__Style {
    top: 0px;

    &.Open__Serch {
      right: 4px;
    }
  }
}