
@property --d{
  syntax: '<angle>';
  inherits: true;
  initial-value: 0deg;
}
@keyframes rotateBackground {
	to { --d: 3600deg; }
}
.boder-effect {
  border: none;
  position: relative;
  z-index: 0;
  transition: .3s;
  cursor: pointer;
  
  border-radius: 5px; 
}
.boder-effect:before {
  content: "";
  position: absolute;
  inset: -3px;
  padding: 3px;
  
  border-radius: 5px; 
  background: conic-gradient(from var(--d, 0deg), #0ed767, #0000 30deg 120deg, #10d665 150deg 180deg, #0000 210deg 300deg, #50b179 330deg);
    -webkit-mask:
        linear-gradient(#000 0 0) content-box,
        linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
}
.boder-effect:after {
    content: "";
    position: absolute;
    inset: -20px;
}
.boder-effect:before,
.boder-effect:after {
    transform: rotate(3600deg);
    transition:.5s, 99999s 99999s transform, 99999s 99999s --d;
}
.boder-effect {
    box-shadow: 0 0 0 1px #666;
}


.boder-effect:after {
    transform: rotate(3600deg);
    transition: .5s,60s linear transform;
}
.boder-effect:before {
    /*--d: 3600deg;*/
    animation: 
		rotateBackground 30s linear infinite;
    transition: .5s,60s linear --d;
}
.boder-effect:before {
    background-color: #ebebeb;
}


.tron-regis {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 5px;
    color: #fff;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: calc(12px +1vh);
    font-style: normal;
    font-variant: normal;
    font-weight: 700;
    line-height: 23px;
    padding: 10px 20px;
    background: linear-gradient(to bottom, #0dd563 0%, #9cf3c1 100%);
    color: #000;
    text-decoration: none;
    display: flex
;
    cursor: pointer;
    text-align: center;
    justify-content: center;
    margin: 0 0px 0 0;
}

.tron-login {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 5px;
    color: #000;
    font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: calc(12px +1vh);
    font-style: normal;
    font-variant: normal;
    font-weight: 700;
    line-height: 23px;
    padding: 10px 20px;
    background: linear-gradient(to bottom, #0dd563 0%, #9cf3c1 100%);
    -webkit-box-shadow: 1px 1px 15px 0 radial-gradient(circle 214px at 49.5% 54.2%, #ffd700 0, #ffd700 96%);
    -moz-box-shadow: 1px 1px 15px 0 radial-gradient(circle 214px at 49.5% 54.2%, #ffd700 0, #ffd700 96%);
    box-shadow: 1px 1px 15px 0 radial-gradient(circle 214px at 49.5% 54.2%, #ffd700 0, #ffd700 96%);
    border: solid #fff000 3px;
    text-decoration: none;
    display: flex
;
    cursor: pointer;
    text-align: center;
    justify-content: center;
}

@media (min-width: 768px) {
    .tron-login {
        margin: 10px 20px 10px 0;
    }
}
@media (min-width: 768px) {
    .tron-regis {
        margin: 0 0px 0 0;
    }
    .tron-login, .tron-regis{
       padding: 10px 15px !important;
       font-size: 10px !important;
   }
   .header-bottom-nav li{
       width: 140px !important;
       
   }
}


@media (max-width: 500px) {
   
   
   .tron{
           margin: 5px 0 5px 0 !important;
   }
   .pt-half {
         padding-top: 5px !important; 
    }
    .pb-half {
         padding-top: 5px !important; 
    }
}
@media (max-width: 430px) {
   
   .tron-login, .tron-regis{
       font-size: 10px !important;
   }
   .tron{
           margin: 5px 0 5px 0 !important;
   }
}

.tron-regis{
    border-radius: 1px !important;
}
