
body:has(.vj-menu.open) .main-header .burger.active span:nth-child(1) {
  animation-name: burger-top-line;
}

.main-header .burger.active span:nth-child(3) {
  transform-origin: bottom left;
  animation-name: burger-bottom-line-reverse;
}

body:has(.vj-menu.open) .main-header .burger.active span:nth-child(3) {
  animation-name: burger-bottom-line;
}

.main-header .burger.active span:nth-child(2) {
  animation-name: burger-fade-in-line;
}

body:has(.vj-menu.open) .main-header .burger.active span:nth-child(2) {
  animation-name: burger-fade-out-line;
}

.mobile-close {
  position: absolute;
  top: 4px !important;
  left: 10px !important;
  font-size: 40px;
  line-height: 1;
}

.vj-menu {
  padding: 35px 15px 15px !important;
  display: none;
  height: 100%;
  align-self: end !important;
  width: 320px;
  overflow-y: auto;
}
.vj-menu ul {
  list-style-type: none;
}
.vj-menu > ul > li {
  padding: 10px 0;
  border-bottom: 1px solid #d8d8d8;
  text-align: end;
  font-size: 15px;
  line-height: 30px;
}

.vj-menu > ul > li:has(.btn-default) {
  line-height: unset;
  height: 73px;
  border: none;
}

.vj-menu > ul > li a {
  color: var(--e-global-color-primary);
}

.vj-menu > ul > li:first-child{
  border-bottom: none;
}
.vj-menu > ul > li:last-child {
  border-bottom: none;
}
.vj-menu ul li:hover {
  border-color: #ccbb9f;
}

.vj-menu .header-social-style1 {
  display: flex;
  justify-content: end;
  gap: 10px;
}

.vj-menu .header-social-style1 li {
  font-size: 30px;
}

[data-navigation] {
  white-space: nowrap;
}

.vj-menu .btn-default{
  position: relative;
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  line-height: 1em;
  text-transform: capitalize;
  padding: 17px;
  transition: all 0.5s ease-in-out;
  overflow: hidden;
  z-index: 0;
  border-style: solid;
  border-width: 1px;
  border-color: #D7E0FB;
  border-radius: 10px 10px 10px 10px;
}

.vj-menu .btn-default:hover{
  background-color: var(--theme-color);;
  color: white;
}