@font-face {
    font-family: 'Myanmar Angoun';
    src: url('../fonts/MyanmarAngoun.woff2') format('woff2'),
         url('../fonts/MyanmarAngoun.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Myanmar Sabae';
    src: url('../fonts/MyanmarSabae.woff2') format('woff2'),
        url('../fonts/MyanmarSabae.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

html{
    background: #f7f7f7;
    /* background: linear-gradient(314deg, rgb(158 0 255) 0%, rgb(0 0 0) 100%); */
}
p,li,th,tr,small,span{
    font-family: 'Myanmar Sabae', sans-serif;
}


.nav-bg{
    background: #682a9b;
    background: -webkit-linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    background: -moz-linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    background: linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(
    startColorstr="#682A9B",
    endColorstr="#EB3636",
    GradientType=1
    );
}
.uk-logo{
    width: 70px;
}
.uk-button {
    padding: 0 20px;
}
.box-shadow-2gray{
    box-shadow: 0px 2px 4px 3px #c3bebe;
}
.golden-button {
    background: linear-gradient(to bottom, #ffd700, #daa520); /* Gold to Goldenrod */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Subtle shadow */
    transition: all 0.3s ease; /* Smooth transition for hover effects */
    color: #000 !important;
  }
  
.golden-button:hover {
    /* Darker gradient on hover */
    background: linear-gradient(to bottom, #f1c147, #ffbe19); /* Goldenrod to DarkGoldenrod */
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3); /* Enhanced shadow on hover */
    transform: translateY(-2px); /* Slight lift effect */
}


.btn-flash:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  }
  
  .btn-flash:active {
    transform: translateY(-1px);
    box-shadow: 0 10x 10px rgba(0, 0, 0, 0.2);
  }
  
  .btn-flash::after {
    content: "";
    display: inline-block;
    height: 100%;
    width: 100%;
    border-radius: 100px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transition: all 0.4s;
  }
  
  .btn-flash::after {
    background-color: #eed3ee;
    transition: all 0.4s;
  }

  
  .btn-flash:hover::after {
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;
    background-color: inherit;
  }


  

/* Additional Myanmar font classes */
.mm-text {
    font-family: 'Myanmar Angoun', sans-serif;
}

.mm-heading {
    font-family: 'Myanmar Angoun', sans-serif;
    /* font-weight: bold; */
}

.mm-button {
    font-family: 'Myanmar Angoun', sans-serif;
    font-weight: normal;
}
.uk-text-medium{
    font-size: 1.1rem;
}

/* Beautiful custom border with rounded corners */
.rounded-1rem {
    border-radius: 1rem;
    border: 5px solid transparent;
    background: linear-gradient(#ffffff94, #ffffff85) padding-box, linear-gradient(68deg, #682a9b, #eb3636, #ffd700) border-box;
    box-shadow: 0 4px 15px rgb(28 19 103 / 81%);
    transition: all 0.3s ease;
}

.rounded-05rem {
    border-radius: 0.5rem;
    border: 1px solid transparent;
    background: linear-gradient(#ffffff94, #ffffff85) padding-box, linear-gradient(68deg, #682a9b, #eb3636, #ffd700) border-box;
    box-shadow: 0 2px 8px rgb(28 19 103 / 81%);
}


.rounded-1rem:hover {
    box-shadow: 0 8px 25px rgba(104, 42, 155, 0.3);
    transform: translateY(-2px);
}

 .uk-slider-nav li a{
    width: 15px;
    height: 15px;
    background-color: #702b96 !important;
    border: 1px solid #751414 !important;
}
.uk-slider-nav .uk-active>*{
    background-color: #a438fd !important;
    width: 15px;
    height: 15px;
    border:1px solid #381058 !important;
}
.icon-tab>.uk-active>a {
    background-color:transparent !important;
    color: #fff;
}

.icon-tab li{
    background: -webkit-linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    background: -moz-linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    background: linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    border-radius: 0.8rem;
    padding: 7px !important;
    text-align: center !important;
    color: white !important;
    margin:5px;
    
}
.icon-tab li img{
    width: 60px;

}
.icon-tab li a{
    display: inline-grid !important;
    color: white !important;
    
}
.icon-tab>*>:first-child {
    padding: 5px 10px;
    background: 0 0;
    color: #ffffff;
}
.icon-tab .uk-active{
    background: linear-gradient(to bottom, #ffd700, #daa520);
    box-shadow: 0 4px 8px rgba(255, 255, 255, 0.2);
    transform: translateY(-15px);
    transition: all 0.3s ease;
}
.group-filter{
    text-align: center;
    border-radius: 1rem;
    margin:3px;
    background: #682a9b;
    background: -webkit-linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    background: -moz-linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    background: linear-gradient(90deg,rgba(104, 42, 155, 1) 0%, rgba(235, 54, 54, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(
    startColorstr="#682A9B",
    endColorstr="#EB3636",
    GradientType=1
    );
}

.uk-subnav-pill>*>:first-child {
    padding: 5px 5px;
    background: 0 0;
    color: #999;
}
.group-filter li a{
    display: inline-grid !important;
    color: white !important;
    text-align: center;
    border-radius: 1rem;
    
}
.group-filter img{
    width: 45px;
}
.group-filter>*,
.group-filter .uk-subnav-pill>*>:first-child {
    padding: 5px;
    text-align: center;
}

.group-filter>.uk-active>a,.group-filter a:hover {
    background: linear-gradient(to bottom, #ffd700, #daa520); /* Gold to Goldenrod */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); /* Subtle shadow */
    transition: all 0.3s ease; /* Smooth transition for hover effects */
    color: #000 !important;
    border-radius: 0.8rem;
    transform: translateY(-15px);
    transition: all 0.3s ease;    
}

.transform-y-top-5:hover{
    transform: translateY(-5px);
    transition: all 0.3s ease;    
}
.transform-y-top-5:after{
    transform: translateY(-5px);
    transition: all 0.3s ease;    
}
.rounded-top{
    border-radius: 1rem 1rem 0 0;
}
.sticky-bottom{
    position: sticky; bottom: 0; left: 0; right: 0;
    text-align: center;
    z-index: 9999;
    margin-top: -70px;
}
.sticky-bottom .uk-navbar-nav{
    /* background: #EA3638;
    background: linear-gradient(180deg, rgba(234, 54, 56, 1) 0%, rgba(204, 16, 19, 1) 100%); */
}
.sticky-bottom li a {
    display: inline-grid !important;
    color: white !important;
    text-align: center;
    padding: 0px 5px;
    margin: 10px;
    min-height: 50px;
}
.sticky-bottom .uk-sticky-logo{
    margin-bottom: 40px !important;
    width: 80px;
}
.inner-curve {
    --r: 12px;
    --s: 50px;
    --a: 20deg;
    --p: 50%;
    height: 71px;
    width: 100%;
    /* aspect-ratio: 2 / 2; */
    background: #EA3638;
    background: linear-gradient(93deg, rgb(106 42 154) 0%, rgb(234 53 54) 100%);
    border-radius: 1rem 1rem 0 0;
    /* border-radius: var(--r); */
    --_m: var(--r), #000 calc(100% - 1px), #0000;
    --_d: (var(--s) + var(--r)) * cos(var(--a));
    mask: radial-gradient(var(--r) at calc(var(--p) + var(--_d)) var(--_m)), radial-gradient(var(--r) at calc(var(--p) - var(--_d)) var(--_m)), radial-gradient(var(--s) at var(--p) calc(-1 * sin(var(--a)) * var(--s)), #0000 100%, #000 calc(100% + 1px)) 0 calc(var(--r) * (1 - sin(var(--a)))) no-repeat, linear-gradient(90deg, #000 calc(var(--p) - var(--_d)), #0000 0 calc(var(--p) + var(--_d)), #000 0);
    position: relative;
    z-index: -100;
    /* margin-bottom: -49px; */
}
.bg-2{
    background-image: radial-gradient( circle farthest-corner at 10% 20%,  rgba(236,158,248,1) 0%, rgba(131,83,241,1) 90.1% );
}
.card-1{
    background: #c65ef2;
    background: linear-gradient(180deg, rgba(198, 94, 242, 1) 0%, rgba(115, 43, 147, 1) 100%);
    border-radius: 1rem;
}
.custom-card-hover:hover{
    transform: translateY(-15px);
    transition: all 0.3s ease; 
}
.card-2{
    background: #f558b4;
    background: linear-gradient(180deg, rgba(245, 88, 180, 1) 0%, rgba(160, 47, 113, 1) 100%);
    border-radius: 1rem;
}
.card-3{
    background: #ff6969;
    background: linear-gradient(180deg, rgba(255, 105, 105, 1) 0%, rgba(212, 55, 55, 1) 68%);
    border-radius: 1rem;
}

.gradient-heading {
    background: -webkit-linear-gradient(left, #8a2be2, #ff0000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #8a2be2; /* Fallback for browsers that don't support the gradient */
  }
.game-logo img,.wallet-logo img{
    filter: grayscale(100);
}
.game-logo img:hover,.wallet-logo img:hover{
    filter: grayscale(0);
    transform: translateY(-10px);
    transition: all 0.3s ease;     
}
.wallet-logo img{
    border-radius: 5rem;
    width: 70px;
}
  @media (max-width: 767px) {
    .uk-heading-small{
        font-size: 1.5rem;
    }
  }