:root {
  --primary-color: #f7901e;
  --secondary-color: #151515;
}

li.menu-item a:after {
  content: "";
  width: 6px;
  aspect-ratio: 1;
  background: rgb(204, 204, 204);
  transform: skewX(-10deg);
}
li.menu-item:last-child a:after {
  display: none;
}
.menu-item.current-menu-item a:after,
.menu-item a:hover:after {
  background: var(--primary-color);
}

.uk-button {
  position: relative;
  transform: skewX(-10deg);
  overflow: hidden !important;
  z-index: 0;
  border: none !important;
}

.uk-button:after,
.uk-button:before {
  content: "";
  width: 0;
  height: 51%;
  position: absolute;
  z-index: -1;
  transition: 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}
.uk-button:after {
  top: 0;
  left: auto;
  right: 0;
}
.uk-button:before {
  bottom: 0;
  left: 0;
  right: auto;
}
.uk-button.uk-button-primary:hover {
  &:after,
  &:before {
    width: 101%;
    background: var(--secondary-color);
  }
}
.uk-button.uk-button-secondary:hover {
  &:after,
  &:before {
    width: 101%;
    background: var(--primary-color);
  }
}

.uk-dotnav {
  align-items: flex-end;
}
.uk-dotnav > * {
  padding-left: 4px !important;
}

.uk-dotnav a {
  width: 20px;
  height: 3px;
  transition: 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transform: skewX(-15deg);
  border-radius: 1px;
}

.uk-dotnav a:hover,
.uk-dotnav .uk-active a {
  height: 6px;
}
@media (min-width: 960px) {
  .uk-navbar-right {
    gap: 10px !important;
    align-items: center;
  }
}
@media (min-width: 1200px) {
  .uk-navbar-left {
    gap: 50px !important;
  }
}
@media (min-width: 960px) and (max-width: 1200px) {
  .uk-navbar-container .uk-container {
    padding-inline: 10px !important;
  }
  .uk-logo img,
  .uk-logo svg {
    width: 160px;
  }
}
/*****
 * Media Queries
 * ****/
@media only screen and (min-width: 950px) {
  .only-sm {
    display: none;
  }
}
@media only screen and (max-width: 950px) {
  .only-md {
    display: none;
  }
}