/*Import Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700&display=swap');
.mb_navbar{background-color: transparent !important;};
body {font-family: 'Raleway', sans-serif;}

/*Vesak 2026*/
.banner-container{position: relative; width: 100vw; height: 100vh; overflow: hidden; background:linear-gradient(135deg, #1a2347 0%, #2d3e6f 50%, #1a2347 100%);margin-top: -4%;}
.banner-container::before{content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%;background-image: url('/assets/site/0917c130f3a3c293072f.webp'); background-size: cover; background-position: center;z-index: 0;}
.buddha-container{position: absolute; left: 15%; top:-35%; transform: translate(-80%,-50%); width: 300px;height: 300px; z-index: 3;}
.buddha-figure{width: 100%; height: 100%; background-image: url('/assets/site/2b8a333ee0c8dea7051b.webp'); background-size: contain; background-repeat: no-repeat; background-position: center; filter: drop-shadow(0 0 20px rgba(135, 206, 235, 0.6)); transform: scale(2.0); z-index: 999; animation: breathe 4s ease-in-out infinite;}
@keyframes breathe {
  0%, 100%{opacity: 0.8; filter: drop-shadow(0 0 10px rgba(135, 206, 235, 0.3)) brightness(1.0);}
  50%{opacity: 1; filter: drop-shadow(0 0 30px rgba(135, 206, 235, 0.3)) brightness(1.6);}
}
.center-content{position: absolute; left:50%;top: 50%; transform: translate(-50%, 20%); text-align: center;z-index: 10; width: 90%; max-width: 600px;}
.main-title{font-size: 48px; font-weight: bold; font-family: 'Montserrat', sans-serif; color: #f7941D;text-transform: uppercase; letter-spacing: 4px; transform: translate(30%, -180%) !important;}
.decorative-line{width:100%; height: 2px; background: linear-gradient(90deg, transparent, #ffffff, transparent); margin: 0 auto 20px; box-shadow: 0 0 10px rbga(74, 159, 255, 0.5); filter: brightness(2.0);transform: translate(30%, -5000%) !important;}
.subtitle{font-size: 18px; color: #ffffff; font-weight: 300; font-family: 'Raleway', sans-serif; transform: translate(30%, -450%);}
.subtitle .highlight{color: #ffffff; font-weight: bold; font-family: 'Raleway', sans-serif;}
.cta-button {transform: translate(5%, -200%);}
[lang="cn"]{
.cta-button{transform: translate(50%, -200%);}
}
[lang="zh"]{
.cta-button{transform: translate(50%, -200%);}
}
[lang="ms"]{
.main-title{font-size: 40px; transform: translate(30%, -240%) !important;}
.subtitle{font-size: 13px; transform: translate(30%, -630%);}
}
[lang="vn"]{
.main-title{font-size: 23px; transform: translate(30%, -430%) !important;}
.subtitle{font-size: 16px; transform: translate(30%, -480%);}
}
[lang="jp"]{
.main-title{font-size: 23px; transform: translate(30%, -430%) !important;}
}
[lang="lo"]{
.subtitle{font-size: 16px; transform: translate(30%, -480%);}
}

/* Laptop view - for screens between 1024px and 1440px */
@media (min-width: 1081px) and (max-width: 1440px) {
/* Vesak 2026*/
.buddha-container{left: 8%; top: -25%; transform: translate(-60%, -50%); width: 250px; height: 250px;}
.main-title{font-size: 48px; transform: translate(30%, -180%) !important;}
.subtitle{font-size: 18px; transform: translate(30%, -450%);}}
.cta-button {transform: translate(5%, -200%);}

/* Smaller laptop screens - 1024px to 1280px */
@media (min-width: 1081px) and (max-width: 1280px) {
.buddha-container{left: 8%;top: -25%; transform: translate(-60%, -50%); width: 250px; height: 250px;}
.main-title{font-size: 48px; transform: translate(30%, -180%) !important;}
.subtitle{font-size: 18px; transform: translate(30%, -450%);}}
.cta-button {transform: translate(5%, -200%);}

/*Tablet view */
@media (max-width: 1080px) {/*Vesak 2026*/.buddha-container{left: 3%;top:45%;transform: translate(50%, -50%);width: 230px;height: 230px;}}

@media (max-width: 860px){
/*Vesak 2026*/
.buddha-container{left: 2%; top:1%; transform: translate(-15%, -50%); width: 230px; height: 230px;}
.main-title{font-size: 40px; transform: translate(25%, -130%) !important;}
.decorative-line{width:90%; height: 2px; transform: translate(30%, -3000%) !important;}
.subtitle{font-size: 18px; transform: translate(25%, -320%);}
.cta-button {transform: translate(5%, -120%);}
[lang="cn"]{
.cta-button {transform: translate(50%, -120%);}
}
[lang="zh"]{
.cta-button {transform: translate(50%, -120%);}
}
[lang="ms"]{
.main-title{font-size: 30px; transform: translate(30%, -180%) !important;}
.decorative-line{width:80%; height: 2px; transform: translate(35%, -3000%) !important;}
.subtitle{ transform: translate(48%, -150%); margin-right: 20%;}
.cta-button {transform: translate(40%, -120%);}
}
[lang="jp"]{
.buddha-container{height: 200px;}
.main-title{font-size: 23px; transform: translate(25%, -250%) !important;}
.decorative-line{width:85%; height: 2px; transform: translate(32%, -3000%) !important;}
.subtitle{ transform: translate(28%, -320%)}
.cta-button {transform: translate(10%, -120%);}
}
[lang="lo"]{
.subtitle{transform: translate(45%, -150%); margin-right: 20%;}
}
}

@media (max-width:431px){
/*Vesak 2026*/
.buddha-container{left: 15%;top: -35%;transform: translate(9%, -80%); width: 230px; height: 230px;}
.main-title{font-size: 28px; transform: translate(1%, 340%) !important; margin-bottom: 3%;}
.decorative-line {width: 400px; margin-bottom: 3%; top:90%; transform: translate(-1%, 5500%) !important;}
.subtitle{font-size: 13px !important; transform: translate(1%, 600%) !important;}
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
[lang="cn"]{
.subtitle{font-size: 18px !important; transform: translate(1%, 420%) !important;}
}
[lang="zh"]{
.subtitle{font-size: 18px !important; transform: translate(1%, 420%) !important;}
}
[lang="ms"]{
.main-title{font-size: 21px; transform: translate(2%, 450%) !important; margin-bottom: 3%;}
.decorative-line {width: 400px; margin-bottom: 3%; top:90%; transform: translate(1%, 5500%) !important;}
.subtitle{font-size: 15px !important; transform: translate(15%, 250%) !important;}
}
[lang="vn"]{
.main-title{font-size: 15px; transform: translate(1%, 600%) !important; margin-bottom: 3%;}
.decorative-line {width: 400px; margin-bottom: 3%; top:90%; transform: translate(-1%, 5500%) !important;}
.subtitle{font-size: 13px !important; transform: translate(1%, 300%) !important;}
.buddha-container{ top:-49%;}
}
[lang="jp"]{
.main-title{font-size: 15px; transform: translate(1%, 600%) !important; margin-bottom: 3%;}
.decorative-line {width: 400px; margin-bottom: 3%; top:90%; transform: translate(-1%, 5500%) !important;}
.subtitle{font-size: 13px !important; transform: translate(1%, 300%) !important;}
}
[lang="lo"]{
.subtitle{font-size: 13px !important; transform: translate(1%, 300%) !important; margin-right: 0%;}
}
}

@media only screen and (max-device-width: 415px) and (-webkit-min-device-pixel-ratio: 2) and (hover: none) and (pointer: coarse){
/*Vesak 2026*/
.buddha-container{left: 15%;top: -35%; transform: translate(12%, -80%); width: 210px; height: 210px;}
.main-title{font-size: 28px; transform: translate(1%, 280%) !important; margin-bottom: 3%;}
.decorative-line{width: 400px; margin-bottom: 3%;top: 90%; transform: translate(-2%, 4500%) !important;}
.subtitle{font-size: 13px !important; transform: translate(1%, 500%) !important;}
.cta-button { transform:translate(2%, 200%) !important; font-size: 9px;}
[lang="cn"]{
.subtitle{font-size: 18px !important; transform: translate(1%, 360%) !important;}
}
[lang="zh"]{
.subtitle{font-size: 18px !important; transform: translate(1%, 360%) !important;}
}
[lang="ms"]{
.main-title{font-size: 21px; transform: translate(2%, 450%) !important; margin-bottom: 3%;}
.subtitle{font-size: 15px !important; transform: translate(15%, 180%) !important;}
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
}
[lang="vn"]{
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
.buddha-container{ top:-40%;}
}
[lang="jp"]{
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
}
[lang="lo"]{
.subtitle{font-size: 13px !important; transform: translate(1%, 250%) !important;}
}
}

@media (max-width: 394px){
.decorative-line{width: 350px;margin-bottom: 3%;top: 90%;transform: translate(-2%, 4500%) !important;}
.subtitle{font-size: 13px !important;transform: translate(-1%, 250%) !important;}
}
  
@media (max-width:391px){
.mb_s1_banner .col-12:first-of-type{height:65vh;}
/*Vesak 2026*/
.buddha-container{left: 14%;top: -35%;transform: translate(6%, -80%);width: 210px;height: 210px;}
.main-title{font-size: 26px; transform: translate(-1%, 320%) !important; margin-bottom: 3%;}
.decorative-line{width: 350px;margin-bottom: 3%;top: 90%;transform: translate(-2%, 4500%) !important;}
.subtitle{font-size: 12px !important;transform: translate(-1%, 530%) !important;}
.cta-button { transform:translate(2%, 200%) !important; font-size: 9px;}
[lang="cn"]{
.subtitle{font-size: 15px !important; transform: translate(1%, 420%) !important;}
}
[lang="zh"]{
.subtitle{font-size: 15px !important; transform: translate(1%, 420%) !important;}
}
[lang="ms"]{
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
}
[lang="vn"]{
.buddha-container{transform: translate(12%, -70%);}
.main-title{font-size: 12px; transform: translate(1%, 800%) !important; margin-bottom: 3%;}
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
}
[lang="jp"]{
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
}
[lang="lo"]{
.subtitle{font-size: 12px !important;transform: translate(-1%, 250%) !important;}
}
}

@media (max-width:376px){
/*Vesak 2026*/
.buddha-container{left: 14%;top: -35%;transform: translate(8%, -70%);width: 190px;height: 190px;}
.main-title{font-size: 25px;transform: translate(-1%, 350%) !important;margin-bottom: 3%;}
.decorative-line{width: 350px;margin-bottom: 3%;top: 90%;transform: translate(-2%, 5000%) !important;}
.subtitle{font-size: 11px !important;transform: translate(-1%, 640%) !important;}
.cta-button { transform:translate(2%, 220%) !important; font-size: 9px;}
[lang="cn"]{
.subtitle{font-size: 15px !important; transform: translate(1%, 450%) !important;}
}
[lang="zh"]{
.subtitle{font-size: 15px !important; transform: translate(1%, 480%) !important;}
}
[lang="vn"]{
.buddha-container{transform: translate(15%, -70%);}
}
[lang="jp"]{
.main-title{font-size: 12px; transform: translate(1%, 800%) !important; margin-bottom: 3%;}
.cta-button { transform:translate(2%, 250%) !important; font-size: 9px;}
}
[lang="lo"]{
.subtitle{font-size: 11px !important;transform: translate(-1%, 320%) !important;}
}
}

@media (max-width: 361px){
/*Vesak 2026*/
.buddha-container{left: 14%;top: -35%;transform: translate(8%, -60%);width: 190px;height: 190px;}
.main-title{font-size: 22px;transform: translate(-2%, 450%) !important;margin-bottom: 3%;}
.decorative-line{width: 320px;margin-bottom: 3%;margin-top: 6% !important;top: 90%;transform: translate(-2, 7000%) !important;}
.subtitle{font-size: 10px !important;transform: translate(-1%, 680%) !important;}
}

section.container-fluid{padding-right: 0; padding-left: 0; margin-left: 0; margin-right: 0;}
@media (max-width: 1367px){.first_section{margin-top: 0;}}
@media (max-width:1312px){section.container-fluid{padding-top: 75px;}}
@media (max-width: 1281px){.first_section{margin-top: 0;}}
@font-face { font-family: redHat; src: url("https://cms.antospnc.asia/assets/font/RedHatDisplay-VariableFont_wght.ttf"); }
@font-face { font-family: inter; src: url("https://cms.antospnc.asia/assets/font/Inter-VariableFont_opsz,wght.ttf"); }
.festival-banner { height: 100vh; width: 100vw; position: relative; padding: 0; }
@font-face{font-family:inter;src:url("/assets/site/58b7817148d34dc9d324.ttf");}
.festival-banner{height:100vh;width:100vw;position:relative;padding:0;}
@media screen and (max-width:3000px){.festival-banner{overflow-x:hidden;overflow-y:hidden;}}
.red-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;}
.festival-banner.char{font-family:redHat!important;display:inline-block;font-size:80px;font-weight:700;background:none!important;color:inherit!important;-webkit-text-fill-color:inherit!important;text-shadow:none;animation:spinning 3s calc(var(--char-index)*0s) ease;}
.spinning[data-splitting] .char{font-family:redHat!important;text-shadow:none;animation:spinning 3s calc(var(--char-index)*0s) ease;background:linear-gradient(to right,#00E0FF 28%,#0057FF 100%)!important;background-size:800% 100%!important;background-position:calc(var(--char-index)*12.5%) 0!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;background-clip:text!important;color:transparent!important;}
@keyframes spinning{50%{transform:rotateY(-360deg);}}
.star-img{height:100%;display:flex;left:10%;position:absolute;align-items:center;animation:glow 4s forwards;}
@keyframes glow{50%{filter:brightness(3);}}
.banner-text-container button{position:relative;background:linear-gradient(90deg,#FF1A50 50%,#730030 100%);color:white;display:block;font-family:"Inter";font-size:18px;width:390px;border-radius:27px;font-weight:600;border:none;padding:3px 20px;box-shadow:0 4px 8px rgba(0,0,0,0.2);}

@media screen and (max-width:2560px){.banner-text-container button{left:100%;} #stocks-no-commission .floating-top-text{top:20%;} #stocks-no-commission .floating-bottom-text{bottom:30%;}}
@media screen and (max-width:1440px){.banner-text-container button{left:70%;} #stocks-no-commission .floating-top-text{top:10%;} #stocks-no-commission .floating-bottom-text{bottom:10%;}}
@media screen and (max-width:1024px){.banner-text-container button{left:50%;} #stocks-no-commission .floating-top-text{top:0%;} #stocks-no-commission .floating-bottom-text{bottom:10%;}}
@media screen and (max-width:768px){.banner-text-container button{left:90%;} #stocks-no-commission .floating-top-text{top:0%;} #stocks-no-commission .floating-bottom-text{bottom:10%;}}
@media screen and (max-width:430px){.banner-text-container button{left:0;}}
@media screen and (max-width:375px){ #stocks-no-commission .floating-top-text{top:10%;} #stocks-no-commission .floating-bottom-text{bottom:20%;}}

.banner-text-container button:hover{box-shadow:1px 1px 20px white;}
.animation-txt{display:flex;align-items:baseline;margin-top:-70px;text-shadow:2px 2px 5px black;font-family:redHat!important;}
.animation-txt p{font-family:redHat!important;font-size:50px;color:white;padding:0 10px;font-style:italic;font-weight:600;}
.flex-txt{display:flex;align-items:baseline;}
.waveVideo{display:none;}

@media screen and (max-width:1600px){.star-img{left:0;} .banner-text-container{left:15%;} .banner-text-container h1{font-size:45px;} .animation-txt p{font-size:45px;} .animated-char{font-size:4rem};}
@media screen and (max-width:1400px) and (max-height:700px){.festival-banner{height:120vh;}}
@media screen and (max-width:1366px) and (max-height:768px){.banner-text-container{left:19%;bottom:5%;}}
@media screen and (max-width:1280px) and (max-height:800px){.banner-text-container{left:19%;bottom:5%;}}
@media screen and (max-width:1200px){.animated-char{font-size:3.5rem};}
@media screen and (max-width:1100px){.animated-char{font-size:3rem};}
@media screen and (max-width:1024px){.festival-banner{height:640px;} .banner-text-container{left:15%;top:5%;}}
@media screen and (max-width:1024px) and (max-height:600px){.banner-text-container{left:16%;top:5%;}}
@media screen and (max-width:1000px){.festival-banner{height:617px;}}
@media screen and (max-width:992px){.festival-banner{margin-bottom:100px;} .animation-txt p{font-size:2.5rem !important;} .animated-char{font-size:2.5rem};}
@media screen and (max-width:952px){.festival-banner{height:592px;}}
@media screen and (max-width:943px){.festival-banner{height:584px; margin-bottom: 100px !important;} .star-img img{width:45%;} .banner-text-container h1{font-size:35px;margin-top:-115px;} .animation-txt p{font-size:30px;} .char{font-size:45px;} .banner-text-container{left:15%;}}
@media screen and (max-width:912px) and (max-height:1380px){.festival-banner{height:570px;}}
@media screen and (max-width:912px) and (max-height:1000px){.festival-banner{height:570px;}}
@media screen and (max-width:870px){.festival-banner{height:543px;}}
@media screen and (max-width:853px){.animated-char{font-size:2.5rem}; .star-img{left:10%;margin-top:15px;} .star-img img{width:45%;}.char{font-size:35px;} .banner-text-container h1{font-size:30px;} .animation-txt p{font-size:25px;} .banner-text-container{top:7%;left:15%;}}
@media screen and (max-width:853px) and (max-height:1000px){.festival-banner{height:533px;}}
@media screen and (max-width:830px) {.animated-char{font-size:2.4rem};}
@media screen and (max-width:820px){.festival-banner{height:512px;} .banner-text-container{left:13%;top:3%;} .banner-text-container h1{margin-top:-70px;} .star-img img{width:40%;}}
@media screen and (max-width:771px){.festival-banner{height:482px;}}
@media screen and (max-width:768px){.animation-txt p{font-size:2rem !important;} .animated-char{font-size:2rem}; .festival-banner{height:480px;padding:0!important;} .banner-text-container{left:15%; top:0;} .banner-text-container h1{margin-top:0px;}}
@media screen and (max-width:730px){.animated-char{font-size:3rem};  .show-promotion-button{margin-top:0.5em;margin-bottom:0.5em;} .festival-banner{height:550px; margin-top:100px;} .star-img{left:-60px;width:100%;} .star-img img{width:90%;} .banner-text-container{justify-content:flex-start;align-items:flex-end;left:20%;} .animation-txt{flex-direction:column;align-items:flex-end;} .flex-txt{display:flex;align-items:baseline;margin-top:-8px;} .banner-text-container h1{font-size:2rem;} .animation-txt p{font-size:20px;} .char{font-size:45px;} .button-container{margin:unset;top:-1%;position:relative;} .button-container button{width:200px;font-size:8px;margin-top:10px;} .margin-top{margin-top:-30px;}}
@media screen and (max-width:640px){.banner-text-container{left:10%;}}
@media screen and (max-width:630px){.banner-text-container{left:10%;}}
@media screen and (max-width:540px){.animation-txt{margin-top:-50px;} .festival-banner{height:100vh;margin-top:0px;} .banner-text-container{left:5%;top:100px;} .banner-text-container h1{margin-top:0px;font-size:2rem;}}
@media screen and (max-width:500px){.banner-text-container h1{margin-top:80px;} .banner-text-container p{font-size:20px;}}
@media screen and (max-width:420px){.banner-text-container h1{font-size:1.5rem;}.animated-char {font-size: 2rem;}}
@media screen and (max-width:380px){.festival-banner{height:100vh;} .banner-text-container h1{margin-top:0px;} .button-container{margin:unset;top:-2%;position:relative;}}
@media screen and (max-width:344px){.banner-text-container{left:0%;} .banner-text-container h1{margin-top:80px;}}