.container-megagen{padding-left:50px;padding-right:50px;margin:0 auto;overflow:hidden;position:relative}
.transition-0{transition:height 0s ease!important}
.custom-background{background-color:#fff!important;color:#000!important}
.main-bg{position:fixed;top:0;left:0;height:100%;width:100%;background-size:cover;z-index:-1}
.main-language{z-index:1;position:relative}
.main-header{display:flex;align-items:center;position:absolute;top:0;left:0;width:100%;margin-top:2.5%}
.main-header .logo{width:100%}
.main-header .logo img{width:200px;position:relative;z-index:999}
.text-data{position:absolute;bottom:5%;left:0}
.text-data h1{color:#fff;font-size:2.5rem;line-height:2.7rem;font-weight:700;margin-bottom:0}
.text-data h1:first-child{font-weight:400;margin-bottom:0}
.text-data h1:last-child{font-weight:800}
.main-body{width:100%;height: 100vh;height:100svh;position:relative;}
.navigation-bg{position:absolute;top:50%;left:47%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}
.navigation-bg .mr-position{position:relative;height:64vh;width:64vh}
/* .navigation-bg .over-img:hover {
    transform: scale(1.1) !important;
} */
@media (max-width:1100px) and (min-width:479px){
.navigation-bg .mr-position{height:60vh;width:60vh;left:-100%}
}
.navigation-bg img{width:100%}
.blue-text{color:#fff;font-weight:500;position:absolute;bottom:2.5vh;left:3vh;font-size:3vh}
.pink-text{color:#fff;font-weight:500;position:absolute;bottom:2.5vh;left:2.5vh;font-size:2.5vh}
.yellow-text{color:#fff;font-size:1.5rem;font-weight:500;position:absolute;bottom:1.7vh;left:2.5vh;font-size:1.7vh}
.green-text{color:#fff;font-size:1.2rem;font-weight:500;position:absolute;bottom:1.5vh;left:2vh;font-size:1.5vh}
.navigation-bg a{text-decoration:none!important}
.navigation-bg .blue{position:fixed;bottom:0;right:5%;width:60%;display:block}
.navigation-bg .pink{position:fixed;top:13%;left:15%;z-index:1;width:40%;display:block}
.navigation-bg .yellow{position:fixed;top:0;left:45%;z-index:2;width:25%;display:block}
.navigation-bg .green{position:fixed;top:15%;right:20%;z-index:3;width:18%;display:block}
.navigation-bg .over-img{transition:all .3s!important;border-radius:16px;-webkit-animation-name:none!important;animation-name:none!important}
@media (max-width:479px){
.navigation-bg .mr-position{position:relative;height:45vh;width:45vh;left:-7%;top:-10px}
}
@media (max-height:350px){
.main-body{height:600px}
.navigation-bg .mr-position{position:relative;height:90vh!important;width:90vh!important;left:-7%;top:-10px}
}
.user-operations .user-box{border:2px solid #dbdde1;border-radius:5px;padding:7px 10px 7px 10px;width:auto;float:right;cursor:pointer;transition:all .1s}
.user-operations .user-box .user-profile{display:flex;align-items:center}
.user-operations .user-down-menu{position:absolute;right:0;top:40px}
.user-operations .user-down-menu{border:1px solid #dbdde1;width:200px;background-color:#fff;border-radius:5px;padding:6px 0 6px 0;z-index:1}
.user-operations .user-down-menu ul{list-style:none;padding-left:0;margin-bottom:0}
.user-operations .user-down-menu ul li a{color:#0a1121;font-size:14px;line-height:18px;padding:12px 0 12px 30px;text-decoration:none;display:flex;align-items:center;width:100%}
.user-operations .user-down-menu ul li a .flag{width:25px;margin-right:10px}
.user-operations .user-down-menu ul .active a{font-weight:600}
.user-operations .user-down-menu ul li:hover{background-color:#f2f2f2}
.user-operations .user-down-menu .line-down-menu{height:.8px;width:100%;background-color:#dbdde1;margin:0 0 7px 0}
.user-profile .flag{height:20px}
.menu-megagen{color:#fff;border:3px solid #fff;z-index:99}
.qr-code{position:absolute;bottom:5%;right:0}
.qr-code img{width:100px}
.logout{position:absolute;bottom:5%;right:0}
@media (min-width:990px){
.button-menu{display:none}
}
@media (max-width:990px){
.menu-megagen{background:#000;background-blend-mode:screen;bottom:0;height:350px;overflow-y:scroll;position:absolute;display:flex;justify-content:center;transform:translateY(350px);transition:transform .3s cubic-bezier(.4,0,.2,1);width:100%}
.menu-megagen .play-col-header .button-border span{padding:0!important;width:100%}
.active .menu-megagen{transform:translateY(0)}
}