
@media screen and (max-width: 768px) {
.nav-8{
  display: none !important;
}
.tel{
  display: block !important;
  z-index: 10000;
  margin-bottom: 0rem !important; 
}
}
@media screen and (min-width: 768px) {

  .tel{
    display: none !important;

  }
}

label .menu {
  position: fixed;
  right: -100px;
  top: -100px;
  z-index: 1000;
  width: 200px;
  height: 200px;
  background: #bea570;
  border-radius: 50% 50% 50% 50%;
  -webkit-transition: .3s ease-in-out;
  transition: .5s ease-in-out;
  box-shadow: 0 0 0 0 #bea570, 0 0 0 0 #bea570;
  cursor: pointer;
  
}

label .hamburger {
  position: absolute;
  top: 135px;
  left: 50px;
  width: 30px;
  height: 2px;
  background: #674a42;
  display: block;
  -webkit-transform-origin: center;
  transform-origin: center;
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
}

label .hamburger:after, label .hamburger:before {
  -webkit-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  background: #674a42;
}

label .hamburger:before { top: -10px; }

label .hamburger:after { bottom: -10px; }

label input { display: none; }

label input:checked + .menu {
  box-shadow: 0 0 0 100vw #bea570, 0 0 0 100vh #bea570;
  border-radius: 0;
  
}

label input:checked + .menu .hamburger {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  
}

label input:checked + .menu .hamburger:after {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  bottom: 0;
  
}

label input:checked + .menu .hamburger:before {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  top: 0;
  
}

label input:checked + .menu + ul { opacity: 1; }

label ul {
  z-index: 20000;
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0;
  -webkit-transition: .25s 0s ease-in-out;
  transition: .25s 0s ease-in-out;
  
}

label a {
  margin-bottom: 1em;
  display: block;
  color: #ffffff;
  text-decoration: none;
  font-size: 5vmax;
  -webkit-text-stroke: 1px black;
}




.nav-8{
  background-color: #1e1e229d;
   position: fixed  ;
    width: 100%;
    height: 100px;
    display: flex;
    flex-wrap: nowrap;
      justify-content: center;
      align-items: center;
  backdrop-filter: blur(5px);
  margin: 0%;
  z-index: 1000;
  }
  .nav-8 nav{
  width: 100%;
    height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  
  }
  .nav-8 .linktext{
    width: auto;
    font-size:1.5vmax;
    text-align:center;
    -webkit-text-stroke-color: #fff;
  
    position:relative;
    z-index:2;
    color:#fff;
    text-decoration:none;
      transition:0.3s ease-in-out;
    -webkit-transition:0.3s ease-in-out;
    transition-delay:0s;
    -webkit-transition-delay:0s;
  }
  .nav-8 .linktext:before, .nav-8 .linktext:after{
    opacity:0;
    position:absolute;
    top:28px;
    transform:translateY(36px);
    -webkit-transform:translateY(36px);
    left:0px;
    width:100%;
    transition:0.3s ease-in-out;
    -webkit-transition:0.3s ease-in-out;
    font-size:0.5em;
  }
  .nav-8 .linktext:before{
    content:'';
    height:3px;
    background:#8E878F;
    transition-delay:0s;
    -webkit-transition-delay:0s;
  }
  .nav-8 .linktext:after{
    padding-top: 6px;
    content:attr(data-text);
    color:#fff;
    transition-delay:0s;
    -webkit-transition-delay:0s;
    
  }
  
  
  .nav-8 .item img{
      width: 150px;
      margin-top: -20px;
  }
  .nav-8 .item{
    position:relative;
    display:inline-block;
    width: auto;
    height:25px;
    margin-left:25px;
    margin-right:25px;
    margin-bottom:20px;
    background:transparent;
    transition:0.3s ease-in-out;
    -webkit-transition:0.3s ease-in-out;
    z-index:2;
    color:#007BFF;
    text-decoration:none;
    text-transform:uppercase;
    transition:0.3s ease-in-out;
    -webkit-transition:0.3s ease-in-out;
  }
  .nav-8 .item:hover .linktext{
    transform:scale(1.3);
    -webkit-transform:scale(1.3);
    transform:translateY(-26px);
    -webkit-transform:(-26px);
  }
  .nav-8 .item:hover .linktext:before{
    transition-delay:0s;
    -webkit-transition-delay:0s;
  }
  .nav-8 .item:hover .linktext:after{
    transition-delay:0.15s;
    -webkit-transition-delay:0.15s;
  }
  .nav-8 .item:hover .linktext:before, .nav-8 .item:hover .linktext:after{
    transform:translateY(16px);
    -webkit-transform:translateY(16px);
    opacity:1;
  }
  