.menu_open {
  display: none;
  position: relative;
  width: 30px;
  height: 20px;
  cursor: pointer;
  margin: 17px;
  margin-right: 15px
}

.menu_open span {
  position: absolute;
  top: 0;
  display: block
}

.menu_open span,
.menu_open span:before,
.menu_open span:after {
  width: 30px;
  height: 3px;
  border-radius: 2px;
  cursor: pointer;
  background-color: #4b93ff;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  -ms-transition: all .2s;
  -o-transition: all .2s;
  transition: all .2s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}

.menu_open span:before,
.menu_open span:after {
  content: '';
  position: absolute;
  left: 0;
  top: 18px
}

.menu_open span:after {
  top: 9px
}

.menu_open.open span {
  background-color: transparent
}

.menu_open.open span:before {
  -webkit-transform: rotate(45deg) translate(-4px, -7px);
  -ms-transform: rotate(45deg) translate(-4px, -7px);
  transform: rotate(45deg) translate(-4px, -7px)
}

.menu_open.open span:after {
  -webkit-transform: rotate(-45deg) translate(1px, 2px);
  -ms-transform: rotate(-45deg) translate(1px, 2px);
  transform: rotate(-45deg) translate(1px, 2px)
}

.hero_s {
  margin-bottom: 30rem;
}

.banner_hero {
  background: linear-gradient(90deg, rgba(5, 6, 6, 0.9) 0%, rgba(17, 20, 20, 0.8) 100%), url(../img/bg_hero.png);
  background-position: top;
  background-size: cover;
  height: 55rem;
  position: absolute;
  top: 0;
  z-index: -1;
  left: 0;
  right: 0;
}
@media (max-width: 800px) { 

  .banner_hero { 
    height: 30rem;
  }
  .hero_s {
    margin-bottom: 10rem;
  }

}

@media(max-width:480px) {

  .banner_hero {

    height: 40rem;
  }
  .hero_s {
    margin-bottom: 12rem;
  }

  .menu_left {
    display: none !important;
  }

  .menu_open {
    display: block
  }
 
  .nav_op {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 100%;
    width: 100%;
    height: 55%;
    z-index: 997;
    background: #fff;
    align-items: unset;
    display: block;
    flex-direction: column;
    justify-content: unset !important;
    padding: 2rem 0;
  }

  .logo {
    margin-left: 15px;
  }

  .nav_op .menu_mob {
    justify-content: center;
    flex-direction: column;
    gap: 25px;
    margin: 0 auto;
  }

  .nav_op .menu_left {
    flex-direction: column;
    display: flex !important;
  }

  .menu_left li {
    color: #222;
  }

  .nav_op .menu_open {

    position: absolute;
    top: 25px;
    right: 5px;
  }

}