@font-face{



    font-family:"Kh-Battambang";



    font-stretch:normal;



    font-style:normal;



    font-weight:normal;



    src: url(/fonts/Battambang-Regular.ttf);



}



@font-face{



    font-family:"Rajdhani";



    font-stretch:normal;



    font-style:normal;



    font-weight:normal;



    src: url(/fonts/Rajdhani-Regular.ttf);



}



html[lang|="kh"] body,html[lang|="kh"] h1,html[lang|="kh"] h2,html[lang|="kh"] h3,html[lang|="kh"] h4,html[lang|="kh"] h5,html[lang|="kh"] h6,html[lang|="kh"] a,html[lang|="kh"] span,html[lang|="kh"] label,html[lang|="kh"] input,html[lang|="kh"] li,html[lang|="kh"] p {font-family:Kh-Battambang !important;}







html[lang|="en"] body,html[lang|="en"] h1,html[lang|="en"] h2,html[lang|="en"] h3,html[lang|="en"] h4,html[lang|="en"] h5,html[lang|="en"] h6,html[lang|="en"] a,html[lang|="en"] span,html[lang|="en"] label,html[lang|="en"] input,html[lang|="en"] li,html[lang|="en"] p {font-family:Rajdhani !important;}

html[lang|="en"] .headerbt ,.text-about{

    font-family:Rajdhani;

    font-weight:700;

}

html[lang|="en"] .detail,.about-detail {

    font-family:Kh-Battambang

}

html[lang|="vn"] .elementor-demo,html[lang|="vn"] .elementor-signup{

 font-size: 12px;

}



body{

    background-color:black;

    height: 100%;

    color: white;

    font-family: Sans-serif;

}

.gAZQBi {

    display: block;

    position: fixed;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    z-index: -1;

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat;

    opacity: 0.3;

}

.important-red {

    color: red !important;

}

.demo-image{

border-radius: 1rem;

overflow: hidden;

border: 2px solid #c5772c;

box-shadow: 0px 0px 15px #c5772c;

}

.border-side{

    border: 2px solid white;

}

.Product{



    padding: 20px;



    margin-top: -20px;



}



.name{



    font-family:sans-serif !important;



    font-weight:bold;



}



.banner-block{



   border-radius: 1rem;



   overflow: hidden;



   border: 2px solid #c67829;



   box-shadow: 0 0 5px #c67829, 0 0 10px #c67829, 0 0 05px #c67829, 0 0 55px #c67829;



}

.banner-block .swiper-slide img{

    border-radius: 1rem;

    overflow: hidden;

}





.banner-block:hover{



    border: 2px solid #c67829;



    box-shadow: 0px 0px 15px #c67829 !important;



    cursor: pointer;



 }



.swiper-pagination-bullet-active{



    background: rgb(255, 255, 255);



    width: 2rem;



    transform: unset;



    margin: 0px 0px 0px 0.1rem;



    border-radius: 0.4rem;



    transition-duration: 0.5s;



}







.grid-3{



    display: grid;



    grid-template-columns: 1fr 1fr 1fr;



    gap: 20px;



}



.card-image{



    position: relative;



    overflow: hidden;



}



.card-image .centered {



    position: absolute;



    top: 50%;



    left: 50%;



    transform: translate(-50%, -50%);



}



.card-image .name {



    position: absolute;



    top: 90%;



    left: 50%;



    transform: translate(-50%, -50%);



    font-size: 1rem;



    color: white;



    text-transform: uppercase;



}



.card-image .centered img {



    width: 130px;



    height: 130px;



    border-radius: 50%;



}



.card-image .bg-card{



    opacity: 0.2;



    transition: all .3s ease-out;



    height: 200px;



}



.card-grid:hover .centered img{



    border: 2px solid #ffffff;

    box-shadow: 0px 0px 15px #c67829;



}



.card-grid:hover{



    border: 2px solid #ffffff;



    box-shadow: 0px 0px 25px #c67829;



    cursor: pointer;



}



.card-image:hover .bg-card{



    transform: scale(1.2);



    transition: transform .5s cubic-bezier(0, .2, .5, 3);



    



}



.card-grid .detail{



}



.fotterctn {



    width: 100%;



    max-width: 1200px;



    margin: 0 auto;



}



.disfooterct {



    display: grid;



    grid-template-columns: repeat(auto-fit, minmax(33%, 1fr));



}







.infootergrid ,.bankcontainer {



    text-align: center;



}



.headerbt {



    display: block;



    color: #ffffff;



    font-size: 30px;



    cursor: pointer;



}



.headerbt:hover {



    color: #e78a00;



}



.bankcontainer img {



    width: 40px;



    margin: 5px;



    height: auto;



}



#api-footer img {



    transition: all .3s ease-out;



    cursor: pointer;



    width: 50px;



    height: 50px;



    border-radius: 50%;



}



#api-footer img:hover {



    transform: scale(1.2);



    transition: transform .5s cubic-bezier(0, .2, .5, 3);



}



.card-grid{



    background: #283046;



    border: 2px solid #c5772c;



    box-shadow: 0px 0px 10px #c5772c;



    border-radius: 50%;



    overflow: hidden;



}



.detail {



    padding: 10px;



    font-size: 14px;



    color: white;







}



.card-grid a{



    text-decoration:none



}



.card-grid:hover {



    background: #161d31;



}



.text-lang-support{



    font-family: sans-serif !important;



    font-size: 1.5rem;



}



.logo-center {



    text-align: center;



}







.linefixed {



    position: fixed;



    right: 10px;



    z-index: 100;



    height: auto;



    top: 60%;



    display: flex;



    flex-direction: column;



    text-align: center;



    



}



.linefixed a {



    margin-top: 10px;



}



#api-footer img{



    transition: all .3s ease-out;



}



#api-footer img:hover{



    border: 2px solid #ffffff;



    box-shadow: 0px 0px 15px #ffffff;



    transform: scale(1.2);



    transition: transform .5s cubic-bezier(0, .2, .5, 3);



}



.linefixed img {



    display: block;



    margin: 0 auto;



    border-radius: 50%;



    width: 50px;



    height: 50px;



    border: 2px solid #ffffff;



    box-shadow: 0px 0px 15px #ffffff;



    transition: all .3s ease-out;



}



.linefixed img:hover {



    transform: scale(1.2);



    transition: transform .5s cubic-bezier(0, .2, .5, 3);



}







:root {



    --swiper-theme-color:   rgb(18, 40, 88);



    --swiper-navigation-size: 40px;



}



.grid-6 {



    padding: 8px;



}



.product-block{



    border: 2px solid #ffffff;



    box-shadow: 0px 0px 5px #ffffff;



    overflow: hidden;



    border-radius: 1rem;



}

.product-block:hover{

    border: 2px solid #F44336;



    box-shadow: 0px 0px 5px #F44336;



}

.product-block img{



    transition: all .3s ease-out;



}



.product-block:hover img{



    transform: scale(1.1);



    transition: transform .5s cubic-bezier(0, .2, .5, 3);



}



.grid-6 img{



    width: 100%;



    height: 100%;



}



.demo-game{



    background: rgb(18, 40, 88);



    border: 2px solid #ffffff;



    box-shadow: 0px 0px 15px #ffffff;



    cursor: pointer;



    z-index: 5;



}



.card-demo{



    position: relative;



}



.card-demo:hover img{



    opacity: 0.2;



}



.card-demo:hover .centered{



    display: unset;



}



.card-demo .centered {



    position: absolute;



    top: 50%;



    left: 50%;



    transform: translate(-50%, -50%);



    font-size: 0.9rem;



    padding: 5px;



    border-radius: 5px;



    display: none;



}



header-page{



    margin-right: auto;



    margin-left: auto;



    position: relative;



    padding-top: 20px;



    display: grid;

    grid-template-columns: 1fr 1fr 1fr;

    z-index: 2;



}



.elementor-logo img {



    width: 110px;



    height: auto;



}



.elementor-signup{



    font-size: 16px;



    font-weight: 700;



    text-transform: uppercase;



    border-radius: 10px;



    padding: 12px 30px 12px 30px;



    width: 150px;



    background: #ff9f43;



    border: 1px solid #ffffff ;



    cursor: pointer;



    transition: all .3s ease-in-out;



    margin-right: 10px;



}



.elementor-signup:hover{



    background: #193154;



    box-shadow: 0px 0px 15px #ffffff !important;



}



.elementor-signup:hover .text{



    color: #ffffff;



}







.elementor-demo{



    font-size: 16px;



    font-weight: 700;



    text-transform: uppercase;



    border-radius: 10px;



    padding: 12px 30px 12px 30px;



    width: 150px;

    background-color: #7367f0;

    /* background: linear-gradient(269deg, #193154 -62%, #193154) ; */



    border: 1px solid #ffffff ;



    cursor: pointer;



    transition: all .3s ease-in-out;



    margin-right: 10px;



}



.elementor-demo:hover{



    background: #193154;



    border: 1px solid #c5772c;



    box-shadow: 0px 0px 15px #c5772c !important;



}



.elementor-demo:hover .text{



    color: #c5772c;



}



.text {



    text-align: center;



    color: rgb(255, 255, 255);



}



.elementor-lang{



    width: 40px;



}



.elementor-lang img{



    width: 100%;



}



.language {



    display: flex;



    justify-content: flex-end;



}



.mr-10{



    margin-right: 10px;



}



.mobile-show{



    display: none;



}



.menu,.close{



    transition: all .3s ease-in-out;



    cursor: pointer;



}







.hide{



    display: none !important;



}

.grid-ii{

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;

  }



  .centered-about {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

  }

  .about-logo{

    position: relative;

    text-align: center;

  }

@media (max-width: 1000px) {

    .elementor-logo img {

        width: 80px;

    }

}

@media (max-width: 768px) {

    .about-detail{

        text-align: center;

    }

    .grid-ii h2{

        text-align: center;

    }

    .centered-about {

        position: unset;

        transform:unset

    }

    .about-logo{

        position: unset;

    }

    .grid-ii{

        display: grid;

        grid-template-columns: 1fr !important;

        gap: 20px;

      }

    .elementor-logo img {

        width: 75px;

    }



  



    .elementor-lang {



        width: 30px;



    }



    .elementor-signup .text ,.elementor-demo .text{



        font-size: 15px;



    }







}



@media (max-width: 600px) {



    /* .elementor-signup, .elementor-demo{



        display: none;



    } */

    .elementor-logo img {

        width: 80px;

    }

    .mobile-show{



        display: unset;



    }



    .language {



        justify-content: right !important;



    }



    .elementor-lang {



        width: 35px;



    }



    .d-sm-flex{



        display: block !important;



    }



    .close{



        width: 25px !important;



    }



}

@media (max-width: 500px) {

    .elementor-logo img {

        width: 70px;

    }

}

@media (max-width: 400px) {

    .elementor-signup, .elementor-demo {

        width: 70px !important;

    }

    .elementor-logo img {

        width: 45px;

    }

    .elementor-signup .text, .elementor-demo .text {

        font-size: 10px;

    }

    .bankcontainer .headerbt, .trueimg span, .grid-ii h2 {

        font-size: 15px !important;

    }

    .about-detail{

        font-size: 10px;

    }

    #api-footer img {

        width: 25px !important;

        height: 25px !important;

    }

    .about-logo img{

        text-align: center;

        height: auto;

        width: 80px !important;

    }

}

.about-logo img{

    text-align: center;

    height: auto;

    width: 150px;

}



dl, ol, ul {



    margin-top: 0;



    margin-bottom: 0;



    padding-left: 0;



}



.elementor-nav-menu{



    background: rgb(40 65 109 / 95%);



    border-radius: 10px;



    padding: 5px;



    border: 1px solid white ;



    box-shadow: 0px 0px 15px #ffffff !important;



    overflow: hidden;



}



.elementor-nav-menu li{



    list-style-type: none;



    padding: 10px;



    border-radius: 5px;



}



.elementor-nav-menu li a{



    text-decoration: none;



    color: white;



}



.demo-modal{



    margin-top: 10px;



    display: none;



    position: absolute;



    width: 100%;



    max-width: 600px;



    left: 0;



z-index: 2;



}



.menu-item:hover {



    cursor: pointer;



    background: linear-gradient(269deg, #193155 -62%, #193154) ;



}



.elementor-nav-menu li:hover a{



    color: #F44336;



}



.modal-content{

    background: #193155 !important;

    border: 2px solid #ffffff;

    box-shadow: 0px 0px 15px #ffffff;

    border-radius: 1rem;

  }

  .signup-btn{

    cursor: pointer;

    transition: all .3s ease-in-out;

    border-radius: 10px;

    background: linear-gradient(269deg, #ffffff -62%, #193154);

    border: 1px solid #ffffff;

  }

  .signup-btn:hover,.signup-btn:focus{

    background: #193154;

    box-shadow: 0px 0px 15px #ffffff !important;

    color: #F44336;

    border-color: #ffffff;

  }

  #api-footer a{

    text-decoration: none;

  }

  .product-icon img{

    width: 50px;

    height: 50px;

    border-radius: 50%;

  }



  .product-icon img{

    border: 2px solid #ffffff;

    box-shadow: 0px 0px 5px #ffffff;

  }



  .product-icon img:hover{

    border: 2px solid #F44336 ;

    box-shadow: 0px 0px 5px #F44336 ;

    cursor: pointer;

  }

  .product-active{

    border: 2px solid #F44336 !important;

    box-shadow: 0px 0px 10px #F44336 !important;

    cursor: pointer;

  }



  .copyright {

    cursor: pointer;

    width: 100%;

    height: auto;

    text-align: center;

    margin: 0 auto;

    padding: 10px 0;

    font-size: 14px;

    display: block;

  }

    .change-lang:hover img ,.lang-active img{

        /* border: 2px solid #F44336 ;

        box-shadow: 0px 0px 15px #F44336 ; */

        cursor: pointer;

        box-shadow: 0px 0px 15px #F44336 ;

        /* border-radius: 50%; */

        padding-left: 5px;

        padding-right: 5px;

        border-radius:5px;

    }

  @keyframes scroll-left {



    0% {



      transform: translateX(0);



    }



    100% {



      transform: translateX(calc(-280px * 4));



    }



  }



  @keyframes scroll-right {



    0% {



      transform: translateX(calc(-280px * 4));



    }



    100% {



      transform: translateX(0);



    }



  }



  .slider {



    margin: auto;



    overflow: hidden;



    position: relative;



    width: 100%;



  }



  .slide-track {



    display: flex;



    width: calc(450px * 8);



  }



  .slide-track.left {



    animation: scroll-left 30s linear infinite;



  }



  .slide-track.right {



    animation: scroll-right 30s linear infinite;



  }



  .slide-track:hover {



    animation-play-state: paused;



  }



  .slide-wrapper-all {



    width: 250px;



  }



  .slide-wrapper {



    width: 100px;



    max-height: 50px;



  }



  .slide-item {



    width: 100%;



    transition: transform 0.5s, box-shadow 0.5s;



  }



  .slide-item:hover {



    transform: scale(1.09);



    cursor: pointer;



  }

@media screen and (max-width: 1200px) {



    :root {



        --swiper-navigation-size: 30px;



    }



}



@media screen and (max-width: 1000px) {

    .elementor-signup, .elementor-demo {

        font-size: 12px;

        width: 130px;

        border-radius: 13px !important;

        padding: 10px !important;

        margin-top: 8px;

    }

    .language{

        margin-top: 5px;

    }



    .grid-3{



        display: grid;



        grid-template-columns: 1fr 1fr ;



        gap: 20px;



    }



    .detail {



        font-size: 13px;



    }



    #api-footer img {



        width: 40px;



        height: 40px;



    }



    .grid-6{



        display: grid;



        grid-template-columns: 1fr 1fr 1fr 1fr;



        gap: 15px;



    }



}

@media (max-width: 1200px) {

    .card-demo .centered {

        width: 120px;

        text-align: center;

    }

}

@media (max-width: 1100px) {

    .card-demo .centered {

        width: 100px;

        text-align: center;

    }

}

@media screen and (max-width: 768px) {

    .elementor-signup ,.elementor-demo{

        width: 120px;

        border-radius:10px !important;

        padding: 6px 10px 6px 10px !important;

        margin-top: 3px !important;

        font-size: 12px !important;

    }

    .language{

        margin-top: 3px !important;

    }



    .product-block{



        border-radius: 0.8rem;



    }



    .demo-game{



        font-size: 10px !important;



    }



    :root {



        --swiper-navigation-size: 25px;



    }



    .grid-3{



        display: grid;



        grid-template-columns: 1fr 1fr ;



        gap: 15px;



    }



    .card-image .centered img {



        width: 70px;



        height: 70px;



        border-radius: 50%;



    }



    .card-image .name {



        font-size: 0.8rem;



    }



    .card-image .bg-card {



        height: 150px;



    }



    .headerbt {



        font-size: 25px;



    }



    .detail {



        font-size: 0.8rem;



    }



    #api-footer img {



        width: 35px;



        height: 35px;



    }



    .card-grid{



        border: 1.5px solid #ffffff;



        box-shadow: 0px 0px 10px #ffffff;



    }



    .banner-block {



        border-radius:1rem;



    }

    .dialog-message {



        width: 100% !important;



    }



}



@media screen and (max-width: 600px) {



    .product-block{



        border-radius: 0.6rem;



    }



    :root {



        --swiper-navigation-size: 23px;



    }



    .card-image .bg-card {



        height: 130px;



    }



    .headerbt {



        font-size: 15px;



    }



    .card-grid{



        border: 1.5px solid #ffffff;



        box-shadow: 0px 0px 10px #ffffff;



    }

    .card-demo .centered {

        width: 90px;

        text-align: center;

    }



}

@media screen and (max-width: 450px) {

    .card-demo .centered {

        width: 60px;

        text-align: center;

    }

    .demo-game{



        font-size: 7.5px !important;



    }

    .product-icon img{

        width: 40px;

        height: 40px;

        border-radius: 50%;

      }

}

@media screen and (max-width: 400px) {

    .product-icon img{

        width: 40px;

        height: 40px;

        border-radius: 50%;

      }

    :root {



        --swiper-navigation-size: 20px;



    }



    .card-image .name {



        font-size: 0.7rem;



    }



    .detail {



        font-size: 10px;



    }



    .banner-block {



        border-radius: 0.8rem;



    }





    iframe {



        width: 100%;



        height: 500px !important;



        border: none;



    }



}



@media screen and (max-width: 350px) {

    .product-icon img{

        width: 30px;

        height: 30px;

        border-radius: 50%;

      }

}

.dialog-login {



    position: fixed;



    top: 0;



    left: 0;



    width: 100%;



    height: 100%;



    background: rgba(0, 0, 0, 0.8); /* Semi-transparent background */



    display: flex;



    justify-content: center;



    align-items: center;



    z-index: 9999; /* Ensure it is above other content */



}



.dialog-type-lightbox {



    position: fixed;



    top: 0;



    left: 0;



    width: 100%;



    height: 100%;



    background: rgba(0, 0, 0, 0.8); /* Semi-transparent background */



    display: flex;



    justify-content: center;



    align-items: center;



    z-index: 9999; /* Ensure it is above other content */



}







/* Centered popup */



.dialog-message {



    width: 80%;



    max-width: 800px;



    background:#193155;



    padding: 20px;



    border-radius: 8px;



    border: 1.5px solid #ffffff;



    box-shadow: 0px 0px 10px #ffffff;



    position: relative;



}







/* Close button */



.close-btn {

text-align: center;

    position: absolute;



    top: 10px;



    right: 10px;



    background: #000;



    color: #fff;



    border: none;



    border-radius: 50%;



    width: 30px;



    height: 30px;



    cursor: pointer;



}







iframe {



    width: 100%;



    height: 550px;



    border: none;



}



.loginregishead {

    position: absolute;

    right: 0;

    display: flex;

}

.lang-img .img-css img,

.lang-img-sidebar .img-css img {

    padding-left: 5px;

    background: #f8d18e;

    padding-right: 5px;

    margin-left: 5px;

    border-radius: 5px;

    width: 50px !important;

    cursor: pointer;

}





.popup-lang img {

    width: 25px !important;

    margin-right: 0.7rem;

}



.language-list__wrapper.selected {

    transform: scale(1);

}



.language-list__wrapper-sidebar.selected {

    transform: scale(1);

    position: relative;

}



.language-list__wrapper-sidebar {

    position: absolute;

    top: 100%;

    right: 0;

    margin-top: 0.1rem;

    min-width: 12rem;

    background: linear-gradient(173deg, #c4a351 30%, #aa7223);

    padding: 0.5rem 0.3rem;

    border-radius: 0.5rem;

    transform: scale(0);

    transform-origin: 11.5rem 0;

}



.language-list__wrapper {

    position: absolute;

    top: 100%;

    right: 0;

    margin-top: 0.1rem;

    min-width: 12rem;

    background: linear-gradient(173deg, #c4a351 30%, #aa7223);

    padding: 0.5rem 0.3rem;

    border-radius: 0.5rem;

    transform: scale(0);

    transform-origin: 11.5rem 0;

    transition: all .3s;

}



.language-list__container {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 0.3rem 0.5rem;

    cursor: pointer;

    transition: all .3s;

}



.language-list__wrapper .language-list__container:hover {

    background: #a62c2c !important;

    border-radius: 5px;

}



.language-list__name {

    display: flex;

    align-items: center;

    font-size: .88rem;

}



.language-list__name-icon {

    -o-object-fit: contain;

    object-fit: contain;

    margin-right: 0.7rem;

    width: 1.5rem;

    height: 1.5rem;

}



.language-list__name span {

    color: #fff;

}



.language-list__name img {

    width: 25px !important;

}