.elementor-17 .elementor-element.elementor-element-e5d9098{--min-height:80px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--justify-content:space-between;--align-items:center;--gap:0px;--background-transition:0.3s;--margin-top:0px;--margin-right:0px;--margin-bottom:0px;--margin-left:0px;--padding-top:0%;--padding-right:5%;--padding-bottom:0%;--padding-left:5%;--z-index:9995;}.elementor-17 .elementor-element.elementor-element-e5d9098:not(.elementor-motion-effects-element-type-background), .elementor-17 .elementor-element.elementor-element-e5d9098 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#111414;}.elementor-17 .elementor-element.elementor-element-e5d9098, .elementor-17 .elementor-element.elementor-element-e5d9098::before{--border-transition:0.3s;}.elementor-17 .elementor-element.elementor-element-e5d9098.e-con{--flex-grow:1;--flex-shrink:0;}.elementor-17 .elementor-element.elementor-element-513a9f2{--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--justify-content:flex-start;--align-items:center;--background-transition:0.3s;--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;}.elementor-17 .elementor-element.elementor-element-5f7660d{text-align:center;width:auto;max-width:auto;}.elementor-17 .elementor-element.elementor-element-5f7660d img{width:100%;height:38.22px;object-fit:contain;}.elementor-17 .elementor-element.elementor-element-5f7660d.elementor-element{--align-self:flex-start;}.elementor-17 .elementor-element.elementor-element-b9e46ee{--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--justify-content:flex-end;--align-items:center;--background-transition:0.3s;--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;}.elementor-17 .elementor-element.elementor-element-b9e46ee.e-con{--align-self:center;}.elementor-17 .elementor-element.elementor-element-ecfc110 .elementor-button .elementor-align-icon-right{margin-left:0px;}.elementor-17 .elementor-element.elementor-element-ecfc110 .elementor-button .elementor-align-icon-left{margin-right:0px;}.elementor-17 .elementor-element.elementor-element-ecfc110 .elementor-button{fill:#EFEBEA;color:#EFEBEA;background-color:#111414;border-style:none;padding:0px 0px 0px 0px;}.elementor-17 .elementor-element.elementor-element-ecfc110 .elementor-button:hover, .elementor-17 .elementor-element.elementor-element-ecfc110 .elementor-button:focus{background-color:var( --e-global-color-secondary );}.elementor-17 .elementor-element.elementor-element-ecfc110{width:auto;max-width:auto;}.elementor-17 .elementor-element.elementor-element-ecfc110.elementor-element{--align-self:center;--flex-grow:0;--flex-shrink:1;}@media(max-width:767px){.elementor-17 .elementor-element.elementor-element-513a9f2{--width:78%;}.elementor-17 .elementor-element.elementor-element-b9e46ee{--width:22%;}}@media(min-width:768px){.elementor-17 .elementor-element.elementor-element-513a9f2{--width:30%;}.elementor-17 .elementor-element.elementor-element-b9e46ee{--width:70%;}}/* Start custom CSS for button, class: .elementor-element-ecfc110 */.faction-menu-button a, .faction-menu-button a .elementor-button {
    background-color: transparent!important;
}

.faction-menu-button:hover a .container22 .bar1,
.faction-menu-button:hover a .container22 .bar2,
.faction-menu-button:hover a .container22 .bar3 {
    background-color:var(--e-global-color-accent)!important;
}/* End custom CSS */
/* Start custom CSS */.container22 {
  display:inline-block;
  cursor: pointer;
  transition: scale 180ms ease-in-out 500ms, transform 280ms ease-in-out 350ms;
  width:75px;
  height:55px;
  text-align:center;
  transform-origin: center;
    transform-box: fill-box;
  
 transform:scale(1);
}

.bar1, .bar2, .bar3 {
    width: 20px;
    height: 20px;
    text-align: center;
    background-color: #fff;
    margin: 8px auto;
    transition: 0.4s;
    border-radius: 100%;
      transform-origin: center;
    transform-box: fill-box;
}
.container22:hover:after {
    content:'MENU';
    position: absolute;
    transform: translate(-50%,0%);
    left:50%;
    top:50%;
    font-size: 8px;
    line-height: 1;
    width: auto;
margin:0 auto;
    
}
.container22:hover{
    transform: scale(3) translate(0px, -6%);
  transform-origin: center;
    transform-box: fill-box;
}
.container22:hover .bar1 {
      transform: translate(0,72.5%);
  transform-origin: center;
    transform-box: fill-box;
}
.container22:hover .bar3 {
  transform: translate(0, -72.5%);
  transform-origin: center;
    transform-box: fill-box;
}

.change .bar1 {
  transform: translate(0, 15px) rotate(-45deg);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
  transform: translate(0, -15px) rotate(45deg);
}

.container22.change{
transform:scale(1.75);
  transform-origin: center;
    transform-box: fill-box;
}/* End custom CSS */