html {scroll-behavior: smooth; }
.bg-h-gray      {background-color: rgb(211, 220, 211); }
.bg-green       {background-color: green; }
.bg-forestgreen {background-color: forestgreen  !important; }
.bg-gray      {background-color: rgb(211, 220, 211); }
.bg-lightgray   { background-color: #f5f7fa;   /* light gray */ }


.bordered { border: 1px solid lightgray; }
.bordered-darkgreen { border: 1px solid rgb(5, 90, 49); }

.bordered-top       { border-top: 1px solid lightgray; }
.bordered-bottom    { border-bottom: 1px solid lightgray; }
.bordered-right     { border-right: 1px solid lightgray; }
.bordered-left      { border-left: 1px solid lightgray; }
.bordered-top-darkgreen     { border-top: 1px solid rgb(5, 90, 49); }
.bordered-right-darkgreen   { border-right: 1px solid rgb(5, 90, 49) !important; }
.bordered-bottom-darkgreen  { border-bottom: 1px solid rgb(5, 90, 49); }

.b-red      { border: 1px solid red; }
.b-orange   { border: 1px solid orange; }
 b-blue     { border: 1px solid blue; }
.b-maroon   { border: 1px solid rgb(108, 104, 104); }
.b-black    { border: 1px solid black; }
.b-dgray    { border: 1px solid darkgray; }

.t-maroon   { color: maroon; }

/* --- TABS CONTAINER ------------------------------------------------- */
.mb-tabs {display: flex; flex-wrap: wrap; gap: 2px; }
/* ================= TAB ================= */
.mb-tab { position: relative; overflow: hidden; flex: 0 0 calc(25% - 10.5px); text-align: center; padding: 8px 10px;
    background: #ffffff; color: #495057; border: 1px solid #e5e7eb; border-radius: 12px 12px 0 0; cursor: pointer;
    transition: transform .25s cubic-bezier(.4,0,.2,1), box-shadow .25s ease, color .25s ease, background-color .25s ease; }
.mb-tab > * { position: relative; z-index: 3; }
/* ================= ROLLING ACCENT (BACKGROUND SHINE) ================= */
@keyframes rollingAccent { 0%   { background-position: 200% 50%; } 100% { background-position: 0% 50%; } }

.mb-tab::after { content: ""; position: absolute; inset: 0;
    background: linear-gradient( 120deg,  transparent, color-mix(in srgb, var(--mb-accent) 40%, transparent), transparent );
    background-size: 200% 100%; opacity: 0; pointer-events: none; z-index: 1; }

/* ================= ANIMATED HOVER BOTTOM LINE ================= */
.mb-tab::before { content: ""; position: absolute; left: 50%; bottom: 0; width: 0; height: 3px;
    background: var(--mb-accent); transition: width .25s ease, left .25s ease; z-index: 2; }
/* ================= HOVER ================= */
.mb-tab:hover::after { opacity: 1; animation: rollingAccent 3s linear infinite; }
.mb-tab:hover::before { width: 100%; left: 0; }
.mb-tab:hover { background: #f8fafc; transform: translateY(-3px); box-shadow: 0 6px 14px rgba(0,0,0,0.06); color: var(--mb-accent); }
/* ================= ACTIVE ================= */
.mb-tab.active { background: linear-gradient( 135deg, var(--mb-accent), color-mix(in srgb, var(--mb-accent) 70%, black) );
    color: #ffffff; border-color: var(--mb-accent); box-shadow: 0 8px 18px rgba(0,0,0,0.08); cursor: default; }
.mb-tab.active i { color: #ffffff !important; }
.mb-tab.active::before { width: 100%; left: 0; height: 3px; background: #ffffff; }
.mb-tab.active::after { display: none; }
/* ========================================================== */

/* --- Accent ----------------------------------------------- */
.mb-a-blue              { --mb-accent: #0d6efd; }
.mb-a-bluelight         { --mb-accent: #e7f1ff; }
.mb-a-lightblue         { --mb-accent: #4dabf7; }
.mb-a-lightbluelight    { --mb-accent: #e9f5ff; }

.mb-a-red               { --mb-accent: #dc3545; }
.mb-a-redlight          { --mb-accent: #fdecec; }
.mb-a-green             { --mb-accent: #198754; }
.mb-a-greenlight        { --mb-accent: #eaf7f0; }

.mb-a-orange            { --mb-accent: #fd7e14; }
.mb-a-orangelight       { --mb-accent: #fff2e6; }

.mb-a-purple            { --mb-accent: #6f42c1; }
.mb-a-purplelight       { --mb-accent: #f1ebff; }

.mb-a-teal              { --mb-accent: #20c997; }
.mb-a-teallight         { --mb-accent: #e6fcf5; }

.mb-a-cyan              { --mb-accent: #0dcaf0; }
.mb-a-cyanlight         { --mb-accent: #e7fafe; }

.mb-a-pink              { --mb-accent: #d63384; }
.mb-a-pinklight         { --mb-accent: #fdeaf3; }

.mb-a-indigo            { --mb-accent: #6610f2; }
.mb-a-indigolight       { --mb-accent: #efe9ff; }

.mb-a-gray              { --mb-accent: #6c757d; }
.mb-a-graylight         { --mb-accent: #f1f3f5; }

/*============================================================*/

:root {
    
    --mb-accent: #6c757d; /* default gray */
    

    --gray-5:   hsl(0, 0%, 5%);
    --gray-10:  hsl(0, 0%, 10%);
    --gray-15:  hsl(0, 0%, 15%);
    --gray-20:  hsl(0, 0%, 20%);
    --gray-25:  hsl(0, 0%, 25%);
    --gray-30:  hsl(0, 0%, 30%);
    --gray-35:  hsl(0, 0%, 35%);
    --gray-40:  hsl(0, 0%, 40%);
    --gray-45:  hsl(0, 0%, 45%);
    --gray-50:  hsl(0, 0%, 50%);
    --gray-55:  hsl(0, 0%, 55%);
    --gray-60:  hsl(0, 0%, 60%);
    --gray-65:  hsl(0, 0%, 65%);
    --gray-70:  hsl(0, 0%, 70%);
    --gray-75:  hsl(0, 0%, 75%);
    --gray-80:  hsl(0, 0%, 80%);
    --gray-85:  hsl(0, 0%, 85%);
    --gray-90:  hsl(0, 0%, 90%);
    --gray-95:  hsl(0, 0%, 95%);
    --gray-100: hsl(0, 0%, 100%);
}

/* Background utilities */
.bg-gray-5   { background-color: var(--gray-5)   !important; }
.bg-gray-10  { background-color: var(--gray-10)  !important; }
.bg-gray-15  { background-color: var(--gray-15)  !important; }
.bg-gray-20  { background-color: var(--gray-20)  !important; }
.bg-gray-25  { background-color: var(--gray-25)  !important; }
.bg-gray-30  { background-color: var(--gray-30)  !important; }
.bg-gray-35  { background-color: var(--gray-35)  !important; }
.bg-gray-40  { background-color: var(--gray-40)  !important; }
.bg-gray-45  { background-color: var(--gray-45)  !important; }
.bg-gray-50  { background-color: var(--gray-50)  !important; }
.bg-gray-55  { background-color: var(--gray-55)  !important; }
.bg-gray-60  { background-color: var(--gray-60)  !important; }
.bg-gray-65  { background-color: var(--gray-65)  !important; }
.bg-gray-70  { background-color: var(--gray-70)  !important; }
.bg-gray-75  { background-color: var(--gray-75)  !important; }
.bg-gray-80  { background-color: var(--gray-80)  !important; }
.bg-gray-85  { background-color: var(--gray-85)  !important; }
.bg-gray-90  { background-color: var(--gray-90)  !important; }
.bg-gray-95  { background-color: var(--gray-95)  !important; }
.bg-gray-100 { background-color: var(--gray-100) !important; }

/*-- Opacity -------------------*/
.op-5 {opacity: 5%; }
.op-10 {opacity: 10%; }
.op-15 {opacity: 15%; }
.op-20 {opacity: 20%; }
.op-25 {opacity: 25%; }
.op-30 {opacity: 30%; }
.op-35 {opacity: 35%; }
.op-40 {opacity: 40%; }
.op-45 {opacity: 45%; }
.op-50 {opacity: 50%; }
.op-55 {opacity: 55%; }
.op-60 {opacity: 60%; }
.op-65 {opacity: 65%; }
.op-70 {opacity: 70%; }
.op-75 {opacity: 75%; }
.op-80 {opacity: 80%; }
.op-85 {opacity: 85%; }
.op-90 {opacity: 90%; }
.op-95 {opacity: 95%; }


.txt-gray-5   { color: var(--gray-5)   !important; }
.txt-gray-10  { color: var(--gray-10)  !important; }
.txt-gray-15  { color: var(--gray-15)  !important; }
.txt-gray-20  { color: var(--gray-20)  !important; }
.txt-gray-25  { color: var(--gray-25)  !important; }
.txt-gray-30  { color: var(--gray-30)  !important; }
.txt-gray-35  { color: var(--gray-35)  !important; }
.txt-gray-40  { color: var(--gray-40)  !important; }
.txt-gray-45  { color: var(--gray-45)  !important; }
.txt-gray-50  { color: var(--gray-50)  !important; }
.txt-gray-55  { color: var(--gray-55)  !important; }
.txt-gray-60  { color: var(--gray-60)  !important; }
.txt-gray-65  { color: var(--gray-65)  !important; }
.txt-gray-70  { color: var(--gray-70)  !important; }
.txt-gray-75  { color: var(--gray-75)  !important; }
.txt-gray-80  { color: var(--gray-80)  !important; }
.txt-gray-85  { color: var(--gray-85)  !important; }
.txt-gray-90  { color: var(--gray-90)  !important; }
.txt-gray-95  { color: var(--gray-95)  !important; }
.txt-gray-100 { color: var(--gray-100) !important; }

.txt-fcolor        { color: rgb(0,128,192); }
.txt-fcolor1       { color: rgb(49, 134, 219); }

.txt-brown          { color: brown !important; }
.txt-white          { color: white !important; }
.txt-blue           { color: rgb(15, 37, 79) !important; }
.txt-darkblue       { color: darkblue !important; }
.txt-darkorange     { color: darkorange !important; }
.txt-darkred        { color: darkred !important; }
.txt-maroon         { color: maroon !important; }
.txt-red            { color: red !important; }
.txt-saddlebrown    { color: saddlebrown !important; }
.txt-lightslategray  { color: lightslategray !important; }
.txt-lightgoldenrodyellow  { color: lightgoldenrodyellow !important; }
.txt-darkgoldenrod  { color: darkgoldenrod  !important; }
.txt-gold           { color:gold  !important; }
.txt-lightred       { color: #ffb6b6 !important; }
.txt-yellow         { color: yellow !important; }

.disabled-div           { pointer-events: none; opacity: 0.20;  }
.disabled-div-50        { pointer-events: none; opacity: 0.50;  }
.disabled-div-75        { pointer-events: none; opacity: 0.75;  }

.w-5 { width: 5%;}   .w-10 { width: 10%;} .w-15 { width: 15%;} .w-20 { width: 20%;}
.w-25 { width: 25%;} .w-30 { width: 30%;} .w-35 { width: 35%;} .w-40 { width: 40%;}
.w-45 { width: 45%;} .w-50 { width: 50%;} .w-55 { width: 55%;} .w-60 { width: 60%;}
.w-65 { width: 65%;} .w-70 { width: 70%;} .w-75 { width: 75%;} .w-80 { width: 80%;}
.w-85 { width: 85%;} .w-90 { width: 90%;} .w-95 { width: 95%;} 

.w-25p {width:25px; } .w-30p {width:30px; } .w-35p {width:35px; } .w-40p {width:40px; }
.w-45p {width:45px; } .w-50p {width:50px; } .w-55p {width:55px; } .w-60p {width:60px; }
.w-65p {width:65px; } .w-70p {width:70px; } .w-75p {width:75px; } .w-80p {width:80px; }
.w-85p {width:85px; } .w-90p {width:90px; } .w-95p {width:95px; } .w-100p {width:100px; }

.w-105p  {width:105px; }  .w-110p  {width:110px; }  .w-115p  {width:115px; }  .w-120p  {width:120px; }  .w-125p  {width:125px; }
.w-130p  {width:130px; }  .w-135p  {width:135px; }  .w-140p  {width:140px; }  .w-145p  {width:145px; }  .w-150p  {width:150px; }
.w-155p  {width:155px; }  .w-160p  {width:160px; }  .w-165p  {width:165px; }  .w-170p  {width:170px; }  .w-175p  {width:175px; }
.w-180p  {width:180px; }  .w-185p  {width:185px; }  .w-190p  {width:190px; }  .w-195p  {width:195px; }  .w-200p  { width:200px; } 
.w-205p  { width:205px; } .w-210p  { width:210px; } .w-215p  { width:215px; } .w-220p  { width:220px; } .w-225p  { width:225px; } 
.w-230p  { width:230px; } .w-235p  { width:235px; } .w-240p  { width:240px; } .w-245p  { width:245px; } .w-250p  { width:250px; }
.w-255p  { width:255px; } .w-260p  { width:260px; } .w-265p  { width:265px; } .w-270p  { width:270px; } .w-275p  { width:275px; }
.w-280p  { width:280px; } .w-285p  { width:285px; } .w-290p  { width:290px; } .w-295p  { width:295px; } 

.w-300p  { width:300px; } .w-305p  { width:305px; } .w-310p  { width:310px; } .w-315p  { width:315px; } .w-320p  { width:320px; }
.w-325p  { width:325px; } .w-330p  { width:330px; } .w-335p  { width:335px; } .w-340p  { width:340px; } .w-345p  { width:345px; }
.w-350p  { width:350px; } .w-355p  { width:355px; } .w-360p  { width:360px; } .w-365p  { width:365px; } .w-370p  { width:370px; }
.w-375p  { width:375px; } .w-380p  { width:380px; } .w-385p  { width:385px; } .w-390p  { width:390px; } .w-395p  { width:395px; }

.w-400p  { width:400px; } .w-405p  { width:405px; } .w-410p  { width:410px; } .w-415p  { width:415px; } .w-420p  { width:420px; }
.w-425p  { width:425px; } .w-430p  { width:430px; } .w-435p  { width:435px; } .w-440p  { width:440px; } .w-445p  { width:445px; }
.w-450p  { width:450px; } .w-455p  { width:455px; } .w-460p  { width:460px; } .w-465p  { width:465px; } .w-470p  { width:470px; }
.w-475p  { width:475px; } .w-480p  { width:480px; } .w-485p  { width:485px; } .w-490p  { width:490px; } .w-495p  { width:495px; }

.w-500p  { width:500px; } .w-505p  { width:505px; } .w-510p  { width:510px; } .w-515p  { width:515px; } .w-520p  { width:520px; } 
.w-525p  { width:525px; } .w-530p  { width:530px; } .w-535p  { width:535px; } .w-540p  { width:540px; } .w-545p  { width:545px; } 
.w-550p  { width:550px; } .w-555p  { width:555px; } .w-560p  { width:560px; } .w-565p  { width:565px; } .w-570p  { width:570px; }
.w-575p  { width:575px; } .w-580p  { width:580px; } .w-585p  { width:585px; } .w-590p  { width:590px; } .w-595p  { width:595px; }

.w-600p  { width:600px; } .w-605p  { width:605px; } .w-610p  { width:610px; } .w-615p  { width:615px; }
.w-620p  { width:620px; } .w-625p  { width:625px; } .w-630p  { width:630px; } .w-635p  { width:635px; }
.w-640p  { width:640px; } .w-645p  { width:645px; } .w-650p  { width:650px; } .w-655p  { width:655px; }
.w-660p  { width:660px; } .w-665p  { width:665px; } .w-670p  { width:670px; } .w-675p  { width:675px; }
.w-680p  { width:680px; } .w-685p  { width:685px; } .w-690p  { width:690px; } .w-695p  { width:695px; }

.w-700p  { width:700px; } .w-705p  { width:705px; } .w-710p  { width:710px; } .w-715p  { width:715px; }
.w-720p  { width:720px; } .w-725p  { width:725px; } .w-730p  { width:730px; } .w-735p  { width:735px; }
.w-740p  { width:740px; } .w-745p  { width:745px; } .w-750p  { width:750px; } .w-755p  { width:755px; }
.w-760p  { width:760px; } .w-765p  { width:765px; } .w-770p  { width:770px; } .w-775p  { width:775px; }
.w-780p  { width:780px; } .w-785p  { width:785px; } .w-790p  { width:790px; } .w-795p  { width:795px; }

.w-800p  { width:800px; } .w-805p  { width:805px; } .w-810p  { width:810px; } .w-815p  { width:815px; }
.w-820p  { width:820px; } .w-825p  { width:825px; } .w-830p  { width:830px; } .w-835p  { width:835px; }
.w-840p  { width:840px; } .w-845p  { width:845px; } .w-850p  { width:850px; } .w-855p  { width:855px; }
.w-860p  { width:860px; } .w-865p  { width:865px; } .w-870p  { width:870px; } .w-875p  { width:875px; }
.w-880p  { width:880px; } .w-885p  { width:885px; } .w-890p  { width:890px; } .w-895p  { width:895px; }

.w-900p  { width:900px; } .w-905p  { width:905px; } .w-910p  { width:910px; } .w-915p  { width:915px; }
.w-920p  { width:920px; } .w-925p  { width:925px; } .w-930p  { width:930px; } .w-935p  { width:935px; }
.w-940p  { width:940px; } .w-945p  { width:945px; } .w-950p  { width:950px; } .w-955p  { width:955px; }
.w-960p  { width:960px; } .w-965p  { width:965px; } .w-970p  { width:970px; } .w-975p  { width:975px; }
.w-980p  { width:980px; } .w-985p  { width:985px; } .w-990p  { width:990px; } .w-995p  { width:995px; }

.w-1000p  { width:1000px; } .w-1005p  { width:1005px; } .w-1010p  { width:1010px; } .w-1015p  { width:1015px; }
.w-1020p  { width:1020px; } .w-1025p  { width:1025px; } .w-1030p  { width:1030px; } .w-1035p  { width:1035px; }
.w-1040p  { width:1040px; } .w-1045p  { width:1045px; } .w-1050p  { width:1050px; } .w-1055p  { width:1055px; }
.w-1060p  { width:1060px; } .w-1065p  { width:1065px; } .w-1070p  { width:1070px; } .w-1075p  { width:1075px; }
.w-1080p  { width:1080px; } .w-1085p  { width:1085px; } .w-1090p  { width:1090px; } .w-1095p  { width:1095px; }

.h-5p {height:5px; }   .h-10p {height:10px; } .h-25p {height:25px; } .h-30p {height:30px; }
.h-35p {height:35px; } .h-40p {height:40px; } .h-45p {height:45px; } .h-50p {height:50px; }
.h-55p {height:55px; } .h-60p {height:60px; } .h-65p {height:65px; } .h-70p {height:70px; }
.h-75p {height:75px; } .h-80p {height:80px; } .h-85p {height:85px; } .h-90p {height:90px; }
.h-95p {height:95px; } 

.h-100p {height:100px; } .h-125p {height:125px; } .h-150p {height:150px; } .h-175p {height:175px; }

.h-200p {height:200px; } .h-225p {height:225px; } .h-250p {height:250px; } .h-275p {height:275px; }

.h-300p {height:300px; } .h-325p {height:325px; } .h-350p {height:350px; } .h-375p {height:375px; }

.h-400p {height:400px; } .h-425p {height:425px; } .h-450p {height:450px; } .h-475p {height:475px; }

.h-500p {height:500px; }

.vh-98min {min-height:98vh; } .vh-97min {min-height:97vh; } .vh-96min {min-height:96vh; } .vh-95min {min-height:95vh; }
.vh-94min {min-height:94vh; } .vh-93min {min-height:93vh; } .vh-92min {min-height:92vh; } .vh-91min {min-height:91vh; }
.vh-90min {min-height:90vh; } .vh-89min {min-height:89vh; } .vh-88min {min-height:88vh; } .vh-87min {min-height:87vh; }
.vh-86min {min-height:86vh; } .vh-85min {min-height:85vh; } .vh-84min {min-height:84vh; } .vh-83min {min-height:83vh; }
.vh-82min {min-height:82vh; } .vh-81min {min-height:81vh; } .vh-80min {min-height:80vh; } .vh-79min {min-height:79vh; }
.vh-78min {min-height:78vh; } .vh-77min {min-height:77vh; } .vh-76min {min-height:76vh; } .vh-75min {min-height:75vh; }
.vh-74min {min-height:74vh; } .vh-73min {min-height:73vh; } .vh-72min {min-height:72vh; } .vh-71min {min-height:71vh; }
.vh-70min {min-height:70vh; } .vh-69min {min-height:79vh; } .vh-68min {min-height:78vh; } .vh-67min {min-height:77vh; }
.vh-66min {min-height:76vh; } .vh-65min {min-height:75vh; } .vh-64min {min-height:74vh; } .vh-63min {min-height:73vh; }
.vh-62min {min-height:72vh; } .vh-61min {min-height:71vh; } .vh-50min {min-height:70vh; } .vh-59min {min-height:79vh; }
.vh-58min {min-height:78vh; } .vh-57min {min-height:77vh; } .vh-56min {min-height:76vh; } .vh-55min {min-height:75vh; }
.vh-54min {min-height:74vh; } .vh-53min {min-height:73vh; } .vh-52min {min-height:72vh; } .vh-51min {min-height:71vh; }
.vh-50min {min-height:70vh; }

.vh-min { min-height: var(--vh); }
.vh-max { max-height: var(--vh); overflow-y: auto; }
.vh1{--vh:1vh;} .vh2{--vh:2vh;} .vh3{--vh:3vh;} .vh4{--vh:4vh;} .vh5{--vh:5vh;}
.vh6{--vh:6vh;} .vh7{--vh:7vh;} .vh8{--vh:8vh;} .vh9{--vh:9vh;} .vh10{--vh:10vh;}
.vh11{--vh:11vh;} .vh12{--vh:12vh;} .vh13{--vh:13vh;} .vh14{--vh:14vh;} .vh15{--vh:15vh;}
.vh16{--vh:16vh;} .vh17{--vh:17vh;} .vh18{--vh:18vh;} .vh19{--vh:19vh;} .vh20{--vh:20vh;}
.vh21{--vh:21vh;} .vh22{--vh:22vh;} .vh23{--vh:23vh;} .vh24{--vh:24vh;} .vh25{--vh:25vh;}
.vh26{--vh:26vh;} .vh27{--vh:27vh;} .vh28{--vh:28vh;} .vh29{--vh:29vh;} .vh30{--vh:30vh;}
.vh31{--vh:31vh;} .vh32{--vh:32vh;} .vh33{--vh:33vh;} .vh34{--vh:34vh;} .vh35{--vh:35vh;}
.vh36{--vh:36vh;} .vh37{--vh:37vh;} .vh38{--vh:38vh;} .vh39{--vh:39vh;} .vh40{--vh:40vh;}
.vh41{--vh:41vh;} .vh42{--vh:42vh;} .vh43{--vh:43vh;} .vh44{--vh:44vh;} .vh45{--vh:45vh;}
.vh46{--vh:46vh;} .vh47{--vh:47vh;} .vh48{--vh:48vh;} .vh49{--vh:49vh;} .vh50{--vh:50vh;}
.vh51{--vh:51vh;} .vh52{--vh:52vh;} .vh53{--vh:53vh;} .vh54{--vh:54vh;} .vh55{--vh:55vh;}
.vh56{--vh:56vh;} .vh57{--vh:57vh;} .vh58{--vh:58vh;} .vh59{--vh:59vh;} .vh60{--vh:60vh;}
.vh61{--vh:61vh;} .vh62{--vh:62vh;} .vh63{--vh:63vh;} .vh64{--vh:64vh;} .vh65{--vh:65vh;}
.vh66{--vh:66vh;} .vh67{--vh:67vh;} .vh68{--vh:68vh;} .vh69{--vh:69vh;} .vh70{--vh:70vh;}
.vh71{--vh:71vh;} .vh72{--vh:72vh;} .vh73{--vh:73vh;} .vh74{--vh:74vh;} .vh75{--vh:75vh;}
.vh76{--vh:76vh;} .vh77{--vh:77vh;} .vh78{--vh:78vh;} .vh79{--vh:79vh;} .vh80{--vh:80vh;}
.vh81{--vh:81vh;} .vh82{--vh:82vh;} .vh83{--vh:83vh;} .vh84{--vh:84vh;} .vh85{--vh:85vh;}
.vh86{--vh:86vh;} .vh87{--vh:87vh;} .vh88{--vh:88vh;} .vh89{--vh:89vh;} .vh90{--vh:90vh;}
.vh91{--vh:91vh;} .vh92{--vh:92vh;} .vh93{--vh:93vh;} .vh94{--vh:94vh;} .vh95{--vh:95vh;}
.vh96{--vh:96vh;} .vh97{--vh:97vh;} .vh98{--vh:98vh;} .vh99{--vh:99vh;} .vh100{--vh:100vh;}

.px1{--px:1px;} .px2{--px:2px;} .px3{--px:3px;} .px4{--px:4px;} .px5{--px:5px;}
.px6{--px:6px;} .px7{--px:7px;} .px8{--px:8px;} .px9{--px:9px;} .px10{--px:10px;}
.px11{--px:11px;} .px12{--px:12px;} .px13{--px:13px;} .px14{--px:14px;} .px15{--px:15px;}
.px16{--px:16px;} .px17{--px:17px;} .px18{--px:18px;} .px19{--px:19px;} .px20{--px:20px;}
.px21{--px:21px;} .px22{--px:22px;} .px23{--px:23px;} .px24{--px:24px;} .px25{--px:25px;}
.px26{--px:26px;} .px27{--px:27px;} .px28{--px:28px;} .px29{--px:29px;} .px30{--px:30px;}
.px31{--px:31px;} .px32{--px:32px;} .px33{--px:33px;} .px34{--px:34px;} .px35{--px:35px;}
.px36{--px:36px;} .px37{--px:37px;} .px38{--px:38px;} .px39{--px:39px;} .px40{--px:40px;}
.px41{--px:41px;} .px42{--px:42px;} .px43{--px:43px;} .px44{--px:44px;} .px45{--px:45px;}
.px46{--px:46px;} .px47{--px:47px;} .px48{--px:48px;} .px49{--px:49px;} .px50{--px:50px;}
.px51{--px:51px;} .px52{--px:52px;} .px53{--px:53px;} .px54{--px:54px;} .px55{--px:55px;}
.px56{--px:56px;} .px57{--px:57px;} .px58{--px:58px;} .px59{--px:59px;} .px60{--px:60px;}
.px61{--px:61px;} .px62{--px:62px;} .px63{--px:63px;} .px64{--px:64px;} .px65{--px:65px;}
.px66{--px:66px;} .px67{--px:67px;} .px68{--px:68px;} .px69{--px:69px;} .px70{--px:70px;}
.px71{--px:71px;} .px72{--px:72px;} .px73{--px:73px;} .px74{--px:74px;} .px75{--px:75px;}
.px76{--px:76px;} .px77{--px:77px;} .px78{--px:78px;} .px79{--px:79px;} .px80{--px:80px;}
.px81{--px:81px;} .px82{--px:82px;} .px83{--px:83px;} .px84{--px:84px;} .px85{--px:85px;}
.px86{--px:86px;} .px87{--px:87px;} .px88{--px:88px;} .px89{--px:89px;} .px90{--px:90px;}
.px91{--px:91px;} .px92{--px:92px;} .px93{--px:93px;} .px94{--px:94px;} .px95{--px:95px;}
.px96{--px:96px;} .px97{--px:97px;} .px98{--px:98px;} .px99{--px:99px;} .px100{--px:100px;}


.br-5 {border-radius:5px; } .br-6  {border-radius:6px; }  .br-7 {border-radius:7px; } .br-8 {border-radius:8px; } 
.br-9 {border-radius:9px; } .br-10 {border-radius:10px; } 

.br-11 {border-radius:11px; } .br-12 {border-radius:12px; } .br-13 {border-radius:13px; } 
.br-14 {border-radius:14px; } .br-15 {border-radius:15px; } .br-16 {border-radius:16px; }
.br-17 {border-radius:17px; } .br-18 {border-radius:18px; } .br-19 {border-radius:19px; } 
.br-20 {border-radius:20px; } 


.o-5 {opacity: 0.05; }  .o-10 {opacity: 0.10; } .o-15 {opacity: 0.15; } .o-20 {opacity: 0.20; }
.o-25 {opacity: 0.25; } .o-30 {opacity: 0.30; } .o-35 {opacity: 0.35; } .o-40 {opacity: 0.40; }
.o-45 {opacity: 0.45; } .o-50 {opacity: 0.50; } .o-75 {opacity: 0.75; } 

.body-wrapper {
    max-width: 1200px;
    background: #ffffff;
    box-shadow:
            0 4px 6px rgba(0, 0, 0, 0.05),
            0 10px 20px rgba(0, 0, 0, 0.08);
}

.b-white {color:white; cursor: pointer;  }
.b-white:hover {color:greenyellow;   } 

.pay-div-hdr { background-color: darkgreen; font-weight: bold; color: white; }
.pay-div-subhdr { background-color: rgba(0,0,0,.8); font-weight: bold;  }



.msds-link {
    color: rgb(0,128,192);
    text-decoration: underline;
    cursor: pointer;
}


.msds-link:hover {
    color: rgb(49, 134, 219) !important;
}


/*-- Added --*/
.msds-link-v1 {
    color: #0d6efd;
    text-decoration: underline;
    cursor: pointer;
}

.msds-link-v1:hover {
    color: #0a58ca;
}


/*--- button effect ------------------------------------------ */
/* =========================================================
   ROLLING ANIMATION
========================================================= */

/* =========================================================
   ROLLING ANIMATION
========================================================= */

@keyframes rollingBg { 0%   { background-position: 200% 50%; } 100% { background-position: 0% 50%; } }

/* =========================================================
   LIGHT BUTTON BASE (mb-btn)
========================================================= */

.mb-btn { position: relative; display: flex; align-items: center; justify-content: center; border-bottom-width: 2px; 
          transition: transform .15s ease, box-shadow .15s ease;}
.mb-btn > * { position: relative; z-index: 2; }

/* colored rolling */
.mb-btn::after { content: ""; position: absolute; inset: 0; 
    background: linear-gradient( 120deg, transparent, color-mix(in srgb, var(--btn-accent) 30%, transparent), transparent);
    background-size: 200% 100%; opacity: 0; pointer-events: none; z-index: 1; }
.mb-btn:hover::after { opacity: 1; animation: rollingBg 5s linear infinite; }
.mb-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,.10); cursor: pointer; border-bottom-color: var(--btn-accent); }

/* =========================================================
   COLORS FOR LIGHT BUTTONS
========================================================= */

.mb-btn-blue {
    /*    --btn-accent: rgb(0,128,192);*/
    --btn-accent: rgb(49, 134, 219);
    /* Just Added     */
    border-bottom: 2px solid var(--btn-accent);
}

.mb-btn-blue.no-bdr {
    border-bottom: 2px solid #ced4da;
}

.mb-btn-lightblue   { --btn-accent: #4dabf7; }
.mb-btn-red         { --btn-accent: #dc3545; }
.mb-btn-green       { --btn-accent: #198754; }
.mb-btn-orange      { --btn-accent: #fd7e14; }
.mb-btn-purple      { --btn-accent: #6f42c1; }
.mb-btn-teal        { --btn-accent: #20c997; }
.mb-btn-cyan        { --btn-accent: #0dcaf0; }
.mb-btn-pink        { --btn-accent: #d63384; }
.mb-btn-indigo      { --btn-accent: #6610f2; }
.mb-btn-gray        { --btn-accent: #6c757d; }

/* =========================================================
   DARK BUTTON BASE (mb-cbtn)
========================================================= */

/* =========================================================
   DARK BUTTON BASE (mb-cbtn)
========================================================= */

.mb-cbtn {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom-width: 2px;
}

/* keep content above overlay */
.mb-cbtn > * {
    position: relative;
    z-index: 2;
}

/* =========================================================
   WHITE ROLLING SHINE
========================================================= */

.mb-cbtn::after {
    content: "";
    position: absolute;
    inset: 0;

    background: linear-gradient(
        120deg,
        transparent,
        color-mix(in srgb, white 35%, transparent),
        transparent
    );

    background-size: 200% 100%;
    opacity: 0;
    pointer-events: none;
    z-index: 1;
}

.mb-cbtn:hover::after {
    opacity: 1;
    animation: rollingBg 5s linear infinite;
}

/* =========================================================
   HOVER FEEL
========================================================= */

.mb-cbtn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,0,0,.10);
    cursor: pointer;
    border-bottom-color: rgba(255,255,255,.6);*/
}

/* =========================================================
   DARK COLOR VARIANTS
========================================================= */

.mb-cbtn-blue       { --btn-accent:#0d6efd; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff;  }
.mb-cbtn-lightblue  { --btn-accent:#4dabf7; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-red        { --btn-accent:#dc3545; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-green      { --btn-accent:#198754; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-orange     { --btn-accent:#fd7e14; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-purple     { --btn-accent:#6f42c1; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-teal       { --btn-accent:#20c997; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-cyan       { --btn-accent:#0dcaf0; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-pink       { --btn-accent:#d63384; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-indigo     { --btn-accent:#6610f2; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }
.mb-cbtn-gray       { --btn-accent:#6c757d; --btn-bg:var(--btn-accent); background-color:var(--btn-bg); color:#fff; }

/* =========================================================
   FLAT ACTIVE STATE
========================================================= */

.mb-btn-active {
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--btn-accent) 35%, white),
        white 90%
    );

    border-bottom: 2px solid var(--btn-accent);
    border-top: 1px double var(--btn-accent);
    color: black;
}

/* dark button flat active */
.mb-cbtn-active {
    background-color: rgba(255,255,255,.12);
    border-bottom: 2px solid var(--btn-accent);
    border-top: 1px double var(--btn-accent);
    
    color: black;
}

/* disable hover + animation */
.mb-btn-active:hover,
.mb-cbtn-active:hover {
    transform: none;
    box-shadow: none;
    cursor: default;
}

.mb-btn-active::after,
.mb-cbtn-active::after {
    opacity: 0 !important;
    animation: none !important;
}


        
/*=== button effect ========================================= */
    

.mb-tab {
    position: relative; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    border-bottom-width: 2px;
    transition: transform .15s ease, box-shadow .15s ease;
}
    
.msds-pointer { cursor:pointer;  }
.r-container {
    max-width: 1080px;
    /*margin: auto;*/
    /*padding: 1rem;*/
}

/* === Modal ------------------------------------------- */
#mb-body { position: relative; width: 100%; height: 100%; }
    /* === MODAL OVERLAY ===================================== */
    #mb-modal { 
        position: absolute; 
        inset: 0; 
        background: rgba(0, 0, 0, 0.6);
        justify-content: center;    /* horizontal center */
        align-items: center;        /* vertical center */
        z-index: 10;
    }

    #mb-modal.show {display: flex; }
    #mb-modal-content { 
        width: 100%; 
        background: #ffffff; 
        border-radius: 5px; 
        min-height: 100%;
    }


/*=======================================================*/

@media (max-width: 576px) {
    .r-container {
        overflow: auto;
        min-width: 375px;
    }
    
    .rw-sm { width: 100%; }
    .d-sm-hide {display: none; }
    .w-sm-25p {width:25px; }
    .w-sm-30p {width:30px; }
    .w-sm-35p {width:35px; }
    .w-sm-40p {width:40px; }
    .w-sm-45p {width:45px; }
    .w-sm-50p {width:50px; }
    .w-sm-55p {width:55px; }
    .w-sm-60p {width:60px; }
    .w-sm-65p {width:65px; }
    .w-sm-70p {width:70px; }
    .w-sm-75p {width:75px; }
    .w-sm-80p {width:80px; }
    .w-sm-85p {width:85px; }
    .w-sm-90p {width:90px; }
    .w-sm-95p {width:95px; }
    .w-sm-100p {width:100px; }

    .w-sm-105p  {width:105px; }
    .w-sm-110p  {width:110px; }
    .w-sm-115p  {width:115px; }
    .w-sm-120p  {width:120px; }
    .w-sm-125p  {width:125px; }
    .w-sm-130p  {width:130px; }
    .w-sm-135p  {width:135px; }
    .w-sm-140p  {width:140px; }
    .w-sm-145p  {width:145px; }
    .w-sm-150p  {width:150px; }
    .w-sm-155p  {width:155px; }
    .w-sm-160p  {width:160px; }
    .w-sm-165p  {width:165px; }
    .w-sm-170p  {width:170px; }
    .w-sm-175p  {width:175px; }
    .w-sm-180p  {width:180px; }
    .w-sm-185p  {width:185px; }
    .w-sm-190p  {width:190px; }
    .w-sm-195p  {width:195px; }

    .w-sm-200p  { width:200px; }
    .w-sm-205p  { width:205px; }
    .w-sm-210p  { width:210px; }
    .w-sm-215p  { width:215px; }
    .w-sm-220p  { width:220px; }
    .w-sm-225p  { width:225px; }
    .w-sm-230p  { width:230px; }
    .w-sm-235p  { width:235px; }
    .w-sm-240p  { width:240px; }
    .w-sm-245p  { width:245px; }
    .w-sm-250p  { width:250px; }
    .w-sm-255p  { width:255px; }
    .w-sm-260p  { width:260px; }
    .w-sm-265p  { width:265px; }
    .w-sm-270p  { width:270px; }
    .w-sm-275p  { width:275px; }
    .w-sm-280p  { width:280px; }
    .w-sm-285p  { width:285px; }
    .w-sm-290p  { width:290px; }
    .w-sm-295p  { width:295px; }

    .w-sm-300p  { width:300px; }
    .w-sm-305p  { width:305px; }
    .w-sm-310p  { width:310px; }
    .w-sm-315p  { width:315px; }
    .w-sm-320p  { width:320px; }
    .w-sm-325p  { width:325px; }
    .w-sm-330p  { width:330px; }
    .w-sm-335p  { width:335px; }
    .w-sm-340p  { width:340px; }
    .w-sm-345p  { width:345px; }
    .w-sm-350p  { width:350px; }
    .w-sm-355p  { width:355px; }
    .w-sm-360p  { width:360px; }
    .w-sm-365p  { width:365px; }
    .w-sm-370p  { width:370px; }
    .w-sm-375p  { width:375px; }
    .w-sm-380p  { width:380px; }
    .w-sm-385p  { width:385px; }
    .w-sm-390p  { width:390px; }
    .w-sm-395p  { width:395px; }

    .w-sm-400p  { width:400px; }
    .w-sm-405p  { width:405px; }
    .w-sm-410p  { width:410px; }
    .w-sm-415p  { width:415px; }
    .w-sm-420p  { width:420px; }
    .w-sm-425p  { width:425px; }
    .w-sm-430p  { width:430px; }
    .w-sm-435p  { width:435px; }
    .w-sm-440p  { width:440px; }
    .w-sm-445p  { width:445px; }
    .w-sm-450p  { width:450px; }
    .w-sm-455p  { width:455px; }
    .w-sm-460p  { width:460px; }
    .w-sm-465p  { width:465px; }
    .w-sm-470p  { width:470px; }
    .w-sm-475p  { width:475px; }
    .w-sm-480p  { width:480px; }
    .w-sm-485p  { width:485px; }
    .w-sm-490p  { width:490px; }
    .w-sm-495p  { width:495px; }

    .w-sm-500p  { width:500px; }
    .w-sm-505p  { width:505px; }
    .w-sm-510p  { width:510px; }
    .w-sm-515p  { width:515px; }
    .w-sm-520p  { width:520px; }
    .w-sm-525p  { width:525px; }
    .w-sm-530p  { width:530px; }
    .w-sm-535p  { width:535px; }
    .w-sm-540p  { width:540px; }
    .w-sm-545p  { width:545px; }
    .w-sm-550p  { width:550px; }
    .w-sm-555p  { width:555px; }
    .w-sm-560p  { width:560px; }
    .w-sm-565p  { width:565px; }
    .w-sm-570p  { width:570px; }
    .w-sm-575p  { width:575px; }
    .w-sm-580p  { width:580px; }
    .w-sm-585p  { width:585px; }
    .w-sm-590p  { width:590px; }
    .w-sm-595p  { width:595px; }

    .w-sm-600p  { width:600px; }
    .w-sm-605p  { width:605px; }
    .w-sm-610p  { width:610px; }
    .w-sm-615p  { width:615px; }
    .w-sm-620p  { width:620px; }
    .w-sm-625p  { width:625px; }
    .w-sm-630p  { width:630px; }
    .w-sm-635p  { width:635px; }
    .w-sm-640p  { width:640px; }
    .w-sm-645p  { width:645px; }
    .w-sm-650p  { width:650px; }
    .w-sm-655p  { width:655px; }
    .w-sm-660p  { width:660px; }
    .w-sm-665p  { width:665px; }
    .w-sm-670p  { width:670px; }
    .w-sm-675p  { width:675px; }
    .w-sm-680p  { width:680px; }
    .w-sm-685p  { width:685px; }
    .w-sm-690p  { width:690px; }
    .w-sm-695p  { width:695px; }
}

@media screen and (min-width: 768px) {
    /* .msds-mid-none { */
    /* display:none;  */
    /* } */
}