@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@100;200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,800,900&display=swap');
@font-face {
    font-family: 'bagonsregular';
    src: url('font/bagons-webfont.eot');
    src: url('font/bagons-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/bagons-webfont.woff2') format('woff2'),
         url('font/bagons-webfont.woff') format('woff'),
         url('font/bagons-webfont.ttf') format('truetype'),
         url('font/bagons-webfont.svg#bagonsregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'sangyoregular';
    src: url('font/sangyo-webfont.eot');
    src: url('font/sangyo-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/sangyo-webfont.woff2') format('woff2'),
         url('font/sangyo-webfont.woff') format('woff'),
         url('font/sangyo-webfont.ttf') format('truetype'),
         url('font/sangyo-webfont.svg#sangyoregular') format('svg');
    font-weight: normal;
    font-style: normal;

}


html, body, div{ margin:0; padding:0; }
html { 
	-ms-text-size-adjust: 100%; 
	-webkit-text-size-adjust: 100%;
	-webkit-box-sizing: border-box;
	box-sizing: border-box; 
}
*,
*:before,
*:after {
	-webkit-box-sizing: inherit;
	box-sizing: inherit;
}
 
body{ 
 font-family: "Montserrat", sans-serif; -webkit-text-size-adjust: none; background:#0f1616; 
 font-size:18px; line-height:1.5; color:#fff; font-weight:400; min-width: 320px;  overflow-x:hidden; } 

body#homepage{ background: url("../img/bg-homepage.jpg") top center no-repeat #0f1616; }
body#subscribepage{ background: url("../img/bg-subscribepage.jpg") top center no-repeat #0f1616; }
 
body#popuppage{ background:#0f1616; padding:0; margin:0; }
body#popuppagethanks{ background:#020404; padding:0; margin:0; }
 

body#demopage{ background: url("../img/bg-LP2026.jpg") top center no-repeat #09090e; }

img{ border:none; max-width:100%; outline:0; vertical-align:middle;  }
:focus { outline:0; }
a:active { outline:none; }
.word-wrap { word-wrap: break-word; } 
.clear{ clear:both; }
.clearvdo{ clear:both; }
.box, .bx{ display:block; position:relative; }
.boxleft, .left{ float:left; }
.boxright, .right{ float:right; }

.txt-center{ text-align:center; }
.txt-left{ text-align:left; }
.txt-right{ text-align:right; }

.table{ display:table; width:100%; margin:0; padding:0; position:relative; }
.table-row{ display:table-row; }
.table-cell{ display:table-cell; }

a:link{ text-decoration:none; color:#ffffff; }
a:visited{ text-decoration:none; color:#ffffff; }
a:hover{ text-decoration:none; color:#ffffff; }

.font-bagons{ font-family: 'bagonsregular'; }
.font-sangyo{ font-family: 'sangyoregular'; }


h1, .h1{ font-size:60px; padding:0; margin:0; font-weight:normal; }
h2, .h2{ font-size:46px; padding:0; margin:0; font-weight:normal; }
h3, .h3{ font-size:42px; padding:0; margin:0; font-weight:normal; }
h4, .h4{ font-size:40px; padding:0; margin:0; font-weight:normal; }
h5, .h5{ font-size:36px; padding:0; margin:0; font-weight:normal; }
h6, .h6{ font-size:24px; padding:0; margin:0; font-weight:normal; }
h7, .h7{ font-size:22px; padding:0; margin:0; font-weight:normal; }
h8, .h8{ font-size:14px; padding:0; margin:0; font-weight:normal; }

#page{ display:block; position: relative; }
.content{ display:block; position: relative; max-width:1690px; width:88%; margin:0 auto; }
 

#bxheader{ display:block; position:fixed; z-index:299; left:0; right:0; top:0; transition: ease 0.5s; background: url("../img/bg-top-nav.png") top center no-repeat; min-height:172px; }	

.bxheader{ display:block; position:relative; padding:39px 0; }
.bxheader > .tb{ display:table; position:relative; width:100%;  }
.bxheader > .tb > .tclogo{ display:table-cell; position:relative;  width:204px; vertical-align:middle; }
.bxheader > .tb > .tcmenu{ display:table-cell; position:relative;  vertical-align:middle; }
 

.bxlogo{ display:block; position:relative; vertical-align: middle;  z-index:899;  }
.bxmenu{ display:block; position:relative; text-align: right; vertical-align: middle; }
.socialbx{ display:inline-block; position:relative; vertical-align: middle; }
.socialbx > a{ margin:0 3px; vertical-align:middle; }
.ticketbtnbx{ display:inline-block; position:relative; vertical-align: middle; margin:0 26px; z-index:899;  }
.menubx{ display:inline-block; position:relative; vertical-align: middle;   }

  

/**2026**/
.bxweltxt2026{ display:block; position:relative; width:91%; margin:0 auto; max-width:1534px; padding-top:55vh; text-transform:uppercase; padding-bottom:104px;  }
.bxweltxt2026 > .bxtxttop{ display:block; position:relative; }
.bxweltxt2026 > .bxtxttop > .tb{ display:table; position:relative; width:100%; }
.bxweltxt2026 > .bxtxttop > .tb > .tcl{ display:table-cell; position:relative; width:50%; vertical-align: top; }
.bxweltxt2026 > .bxtxttop > .tb > .tcl > .bx{ display:block; position:relative;  width:96%; }
.bxweltxt2026 > .bxtxttop > .tb > .tcr{ display:table-cell; position:relative; width:50%; vertical-align: bottom; }
.bxweltxt2026 > .bxtxttop > .tb > .tcr > .bx{ display:block; position:relative; font-size:640%; line-height:0.86;  width:94%; margin:0 auto; }

.bxweltxt2026 > .bxtxtdate{ display:block; position:relative; font-size:630%; line-height:0.9; margin:39px 0 52px; } 
.bxweltxt2026 > .bxtxtall{ display:block; position:relative; font-size:600%; line-height:0.9; }
.bxweltxt2026 > .bxtxtall span{ color:#dabd1e;  }


#bxhomevdo{ display:block; position:relative; padding:0 0 70px; }
.bxhomevdo{ display:block; position:relative; text-align:center; padding:0 0 52px;   }
.homevdobx{ display:inline-block; position:relative; max-width:64%; margin:0 auto; }
.homevdobx > img{ border-radius:280px; opacity:1; width:100%; border:#ffffff solid 1px;}
.homevdobx > a{ position:absolute; top:0; left:0; bottom:0; right:0;  border-radius:280px;   }
.homevdobx > a >.tb{ display:table; position:relative; width:100%; height: 100%;   }
.homevdobx > a >.tb > .tc{ display:table-cell; position:relative; vertical-align:middle; }
.homevdobx > a >.tb > .tc > .iconplay{ 
  display:inline-block; position:relative; width:100px; height:100px; border-radius:50%; transition:ease 0.5s;
  background:url("../img/icon-play-vdo.png") center center no-repeat rgba(6,0,253,1);   }
.homevdobx > a:hover >.tb > .tc > .iconplay{ background-color:rgba(6,0,253,0.5); }





/** subscribepage **/
.bxsubscribe{ 
	display:block; position:relative;  width:450px; margin:0 auto 65px; border-radius:320px;
	padding:104px 0; min-height:806px; border:#fff solid 1px;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(0px) saturate(150%);
	-webkit-backdrop-filter: blur(0px) saturate(150%);
	box-shadow: 0px 13px 64px 12.92px rgba(0,0,0,1);
}
.subscribebxform{ display:block; position:relative; max-width:320px; margin:0 auto; } 
.subscribebxform > .bxh{ display:block; position:relative; padding:0 0 26px;  }
.subscribebxform > .bxh{ display:block; position:relative; width:100%; }
.subscribebxform > .bxh > .icon{ display:block; position:relative; padding:0 0 10px; }
.subscribebxform > .bxh > .txt{ display:block; position:relative;  text-transform:uppercase;  color:#fff;  }
.subscribebxform > .bxh > .txt > .txth{ font-size:388%; line-height:1;  }
.subscribebxform > .bxh > .txt > .txt{ font-size:216%; line-height:1.1; }




.bxinput{ display:block; position:relative; margin-bottom:16px; }
.bxinput > .txtname{ display:block; position:relative; padding:6px 22px; }
.bxinput > .txtinput{ display:block; position:relative;  }
 
.g-recaptcha{ display:inline-block; position:relative; text-align: center; }
.g-recaptcha div{ display:block; margin:0 auto;  text-align: center; width:320px; }

#subscribeform{ display:block; position:relative;  } 
#subscribeform input{ 
 display:block; position:relative; width:100%; padding:16px 22px; font-family: inherit; font-size:18px;  font-weight:inherit; background:rgba(15,22,22,0.2); border:#c4c4c4 solid 1px; color: #fff; border-radius:32px;   }

#subscribeform input::-webkit-input-placeholder{ color: #858585; opacity:1; }
#subscribeform input:-moz-placeholder{ color: #858585; opacity:1;  }
#subscribeform input::-moz-placeholder{ color: #858585; opacity:1;  }
#subscribeform input:-ms-input-placeholder{ color: #858585; opacity:1;  }

#subscribeform input:focus{  border-color:#fff; }  


#subscribeform label { display:block; padding:0; margin:0; text-align:left; }
#subscribeform label.error{ margin-left: 0px; color:#ff1414; font-size:12px; font-style:italic; }
#subscribeform input.error{ border-color:#ff1414;   }
 
#subscribeform .selectsubs select{
   background: transparent; width:105%; padding:16px 22px; cursor:pointer; color:#fff; border:0px; font-size:18px;  }
#subscribeform .selectsubs option{
    border:none!important; margin:0; padding:6px 22px; background:none; font-size:18px; color:#0f1616;  }
#subscribeform .selectsubs{ 
 display:block; position:relative; width:100%;overflow: hidden; cursor:pointer;
 background: url(../img/select.png)  96% no-repeat rgba(15,22,22,0.2); border:#c4c4c4 solid 1px; color: #fff; border-radius:32px;  }

#subscribeform .selectsubs select:focus{  border-color:#fff; } 
 
#subscribeform input[type=submit]{ 
  display:block; position: relative; color:#fff; font-weight:700; padding:14px 26px; border-radius:36px; transition:ease 0.5s; width:220px; text-transform:uppercase;  cursor:pointer; border:#ffffff solid 1px; margin:0 auto; 
  font-size:211%; line-height:1; font-family: 'sangyoregular'; text-align:left;
	background: url("../img/icon-go.png") 96% no-repeat rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(0px) saturate(100%);
	-webkit-backdrop-filter: blur(0px) saturate(100%);
	box-shadow: 0px 13px 64px 12.92px rgba(0,0,0,1); 
} 
#subscribeform input[type=submit]:hover{ color:#dabd1e; } 
#subscribeform input[type=submit]:disabled { opacity:0.4; cursor: no-drop; }
#subscribeform input[type=submit]:disabled:hover{ color:#fff; }
.bxthanks{ display:block; position:relative; text-align: center; padding:104px 0; }
/** end subscribepage **/

 


.bxpolicy{ display:block; position:relative; max-width:80%; margin:0 auto; }
.bxpolicy > h3{ display:block; position: relative; padding:39px 0; text-align: center; }
.bxpolicy > h4{ display:block; position: relative; padding:0 0 26px;  }
.bxpolicy > h7{ font-weight:600; }
.bxpolicy > ul{ padding:0 0 0 26px;  }
.bxpolicy > a{ color:#00ffff; text-decoration: underline;  transition: ease 0.5s;  }
.bxpolicy > a:hover{ color:#fff; }
.bxpolicy > .linex{ display:block; position: relative; padding:26px 0; text-align: center; background: url("../img/linex-page.png") center no-repeat; height:1px; }
.bxpolicy > .fw600{ font-weight:600; }


 
 


#bxfooter{ display:block; position:relative; padding:85px 0; background:#09090e; }
.footer-subcribe{ display:block; position:relative; padding:0 0 39px; text-align:center; }
.footer-address{ display:block; position:relative; padding:0 0 26px; text-align:center; }
.footer-social{ display:block; position:relative; padding:0 0 26px; text-align:center; }
.footer-link{ display:block; position:relative; text-align:center; }
.footer-link a{ text-decoration:underline; }
#bxfooter a{ transition:ease 0.5s;  }
#bxfooter a:hover{ color:#dabd1e; }



a.btnfb{ display:inline-block; position:relative; width:32px; height:32px; background: url("../img/icon-fb-white.png") no-repeat; background-size:100%; transition:ease 0.4s;  }
a.btnfb > span{ position:absolute; top:0; bottom:0; right:0; left:0; background: url("../img/icon-fb-yellow.png") no-repeat; background-size:100%; opacity:0; transition:ease 0.4s;  }
a.btnfb:hover{ background:transparent; }
a.btnfb:hover > span{ opacity:1; } 

a.btnig{ display:inline-block; position:relative; width:32px; height:32px; background: url("../img/icon-ig-white.png") no-repeat; background-size:100%; transition:ease 0.4s;  }
a.btnig > span{ position:absolute; top:0; bottom:0; right:0; left:0; background: url("../img/icon-ig-yellow.png") no-repeat; background-size:100%; opacity:0; transition:ease 0.4s;  }
a.btnig:hover{ background:transparent; }
a.btnig:hover > span{ opacity:1; }

a.btnyt{ display:inline-block; position:relative; width:32px; height:32px; background: url("../img/icon-yt-white.png") no-repeat; background-size:100%; transition:ease 0.4s;  }
a.btnyt > span{ position:absolute; top:0; bottom:0; right:0; left:0; background: url("../img/icon-yt-yellow.png") no-repeat; background-size:100%; opacity:0; transition:ease 0.4s;  }
a.btnyt:hover{ background:transparent; }
a.btnyt:hover > span{ opacity:1; }

a.btntt{ display:inline-block; position:relative; width:32px; height:32px; background: url("../img/icon-tt-white.png") no-repeat; background-size:100%; transition:ease 0.4s;  }
a.btntt > span{ position:absolute; top:0; bottom:0; right:0; left:0; background: url("../img/icon-tt-yellow.png") no-repeat; background-size:100%; opacity:0; transition:ease 0.4s;  }
a.btntt:hover{ background:transparent; }
a.btntt:hover > span{ opacity:1; }

a.btnx{ display:inline-block; position:relative; width:32px; height:32px; background: url("../img/icon-x-white.png") no-repeat; background-size:100%; transition:ease 0.4s;  }
a.btnx > span{ position:absolute; top:0; bottom:0; right:0; left:0; background: url("../img/icon-x-yellow.png") no-repeat; background-size:100%; opacity:0; transition:ease 0.4s;  }
a.btnx:hover{ background:transparent; }
a.btnx:hover > span{ opacity:1; }

a.btnsc{ display:inline-block; position:relative; width:32px; height:32px; background: url("../img/icon-sc-white.png") no-repeat; background-size:100%; transition:ease 0.4s;  }
a.btnsc > span{ position:absolute; top:0; bottom:0; right:0; left:0; background: url("../img/icon-sc-yellow.png") no-repeat; background-size:100%; opacity:0; transition:ease 0.4s;  }
a.btnsc:hover{ background:transparent; }
a.btnsc:hover > span{ opacity:1; }
 
 


a.btnsubcribe{ display:inline-block; position:relative; background:#026355; padding:32px; border-radius:60px; transition:ease 0.5s;   }
a.btnsubcribe > .tb{ display:table; position:relative; width:100%;  }
a.btnsubcribe > .tb > .tc-imail{ display:table-cell; position:relative; width:81px; vertical-align: top; }
a.btnsubcribe > .tb > .tc-text{ display:table-cell; position:relative; vertical-align: top;  text-align:left; }
a.btnsubcribe > .tb > .tc-icon{ display:table-cell; position:relative; width:62px; vertical-align: top; }

a.btnsubcribe > .tb > .tc-imail > .bx{ display:block; position:relative; width:81px; height:69px; background: url("../img/icon-email.png") no-repeat; background-size:100%;  margin-top:-16px;}
a.btnsubcribe > .tb > .tc-imail > .bx > span{ position:absolute; top:0; left:0; bottom:0; right:0; background: url("../img/icon-email-black.png") no-repeat; background-size:100%; transition:ease 0.5s; opacity:0;  }

a.btnsubcribe > .tb > .tc-text > .bx{ display:block; position:relative; padding:0 16px 0 0; font-size:22px; line-height:1; }
a.btnsubcribe > .tb > .tc-text > .bx > div{ font-size:40px; }

a.btnsubcribe > .tb > .tc-icon > .bx{ display:block; position:relative; width:62px; height:62px; background: url("../img/icon-right-sky.png") no-repeat; background-size:100%; }
a.btnsubcribe > .tb > .tc-icon > .bx > span{ position:absolute; top:0; left:0; bottom:0; right:0; background: url("../img/icon-right-black.png") no-repeat; background-size:100%; transition:ease 0.5s; opacity:0;  }

a.btnsubcribe:hover{ color:#1f4242; background-color: #84f5de; background-image: linear-gradient(320deg, #84f5de 0%, #56e8f2 50%, #4cc5f8 100%); box-shadow: 0px 0px 16px 4px rgba(0, 255, 255, 0.6); }
a.btnsubcribe:hover > .tb > .tc-imail > .bx > span{ opacity:1; }
a.btnsubcribe:hover > .tb > .tc-icon > .bx > span{ opacity:1; }


a.btnback{ 
  display:inline-block; position:relative; color:#fff; transition:ease 0.5s; font-weight:bold; text-transform:uppercase; }
a.btnback > img{ margin-right:12px;  }
a.btnback:hover{ color:#00ffff; }


a.btnemali{ display:inline-block; position:relative; vertical-align:middle;  }
a.btnemali > .icon{ display:inline-block; position:relative; vertical-align:middle; width:110px; height:90px; background: url("../img/icon-mail.png") no-repeat; background-size:100%; transition:ease 0.5s; }
a.btnemali > .txt{ display:inline-block; position:relative; vertical-align:middle; text-shadow: rgba(0,255,255,1) 0px 0px 10px, rgba(0,255,255,1) 0px 0px 20px,rgba(0,255,255,1) 0px 0px 30px; transition:ease 0.5s; }

a.btnemali:hover > .icon{ background-image: url("../img/icon-mail-hover.png");   }
a.btnemali:hover > .txt{ color:#b3b3b3; text-shadow:rgba(0,255,255,0) 0px 0px 0; } 


#cookiesbx{ 
 display: none; position:fixed; left: 0px; right: 0px; bottom:0px;  background:rgba(0,0,0,0.9); color:#ffffff;  z-index:9999; line-height:1.8;    }
.cookiesbx{ display:block; position:relative; padding:20px 0; width:88%; margin: 0 auto; }
.cookiesbx > .tb{ display:table; position: relative; width:100%; }
.cookiesbx > .tb > .c1{ display:table-cell; position: relative; vertical-align:top; }
.cookiesbx > .tb > .c2{ display:table-cell; position: relative; vertical-align:top; text-align: right;  }
.cookiesbx > .tb > .c1 > .bx{ display:block; position: relative; width:100%; }
.cookiesbx a{ color:#fff; text-decoration:underline; transition: ease 0.5s; }
.cookiesbx a:hover{ color:#dabd1e; }
.cookiesbx button{  display:inline-block; position: relative; background: rgba(15,22,22,0.2);  color:#dabd1e; padding:14px 26px; border-radius:40px; transition:ease 0.5s; width:190px; text-transform:uppercase;  cursor:pointer; border:none;   box-shadow: 0px 0px 18px 8px rgba(218, 189, 30, 0.6); font-size:20px; font-family:inherit; font-weight:600;   }
.cookiesbx button:hover{ color:#fff; /* background-color: #dabd1e; background-image: linear-gradient(320deg, #dabd1e 0%, #09090e 50%, #09090e 100%); */  }	 
 
#topcontrol{ z-index:199; }
#btntop{ display:none; position: relative; width:66px; height:66px; border:#00ffff solid 2px; text-align: center; bottom:48px; right:48px; border-radius:50%;  } 
#btntop > span{ 
 display:inline-block; position: relative; width:20px; height:24px; background: url("../img/icon-top.png");  
 -webkit-transform: translateY(20px); transform: translateY(20px); transition: all .2s ease; background-size:100%;  }
#btntop:hover > span{  -webkit-transform: translateY(6px); transform: translateY(6px); }