:root {
            --ngg-bg-dark: #31271d;
            --ngg-bg-darker: #0f0f0f;
            --ngg-gold: #f5c518;
            --ngg-gold-light: #ffdb4d;
            --ngg-text-light: #ffffff;
            --ngg-text-muted: #c3c0bc;
            --ngg-border-radius: 60px;
            --ngg-tab-height: 70px;
            --ngg-font-main: 'Arial', sans-serif;
            --ngg-not-selected: #c3c0bc;
        }

        .ngg-container {
            max-width: 1300px;
            margin: 0 auto;
        }

        .ngg-tabs-container {
            position: relative;
            overflow: hidden;
            border-radius: var(--ngg-border-radius);
            border:1px solid #e6ac6d;
            background: var(--ngg-bg-dark);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
        }

        .ngg-tabs {
            display: flex;
            flex-wrap: nowrap;
            overflow-x: auto;
            scrollbar-width: none;
            -ms-overflow-style: none;
        }

        .ngg-tabs::-webkit-scrollbar {
            display: none;
        }

        .ngg-tab {
            flex: 1 0 200px;
            min-width: 180px;
            padding: 15px 20px;
            text-align: center;
            cursor: pointer;
            transition: all 0.3s ease;
            position: relative;
            white-space: nowrap;
            border-radius:var(--ngg-border-radius);
            color:var(--ngg-not-selected);
        }

        .ngg-tab.ngg-active {
            background: linear-gradient(135deg, var(--ngg-gold), var(--ngg-gold-light));
            color: #000;
            font-weight: bold;
        }
        /*
        .ngg-tab.ngg-active::after {
            content: '';
            position: absolute;
            bottom: -10px;
            left: 50%;
            transform: translateX(-50%);
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-top: 10px solid var(--ngg-gold);
            transition: all 0.3s ease;
        }*/

        .ngg-tab.ngg-disabled {
            opacity: 1;
            cursor: not-allowed;
            pointer-events: none;
            color: var(--ngg-text-muted);
        }
        .ngg-tab.ngg-disabled span, .ngg-tab:not(.ngg-disabled) span { color:var(--ngg-gold); }
        .ngg-tab.ngg-active span { color:#000; }
        .ngg-tab.ngg-active:hover span { color:gold; }


        .ngg-tab:not(.ngg-disabled):hover {
            background: rgba(245, 197, 24, 0.2);
            color:#fff; 
        }

        .ngg-tab-title {
            font-size: 1.5rem;
            font-weight: 800;
            letter-spacing: 0.5px;
            margin-bottom: 4px;
        }

        .ngg-tab-date {
            font-size: 2.3rem;
            font-weight: 800;
        }

        .ngg-tab.ngg-active .ngg-tab-date {
            font-size: 2.3rem;
            font-weight:800;
        }

        .ngg-tab-content-container {
            padding: 3% 30px 40px;
            /*
            background: var(--ngg-bg-dark);
            border-radius: 0 0 var(--ngg-border-radius) var(--ngg-border-radius);*/
            min-height: 200px;
            display: none;
        }

        .ngg-tab-content-container.ngg-active {
            display: block;
            animation: ngg-fadeIn 0.5s ease;
        }

        @keyframes ngg-fadeIn {
            from {
                opacity: 0;
                transform: translateY(10px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .ngg-content-title {
            font-size: clamp(2rem, 3vw, 3rem);
            color: var(--ngg-gold);
            font-weight:800;
        }
        .ngg-content-subtitle { font-size: clamp(2rem, 3vw, 3rem); color:#fff; font-weight:700; }

        .ngg-content-desc {
            font-size: 1.1rem;
            line-height: 1.6;
            color: var(--ngg-text-light);
        }

        /* NGG Pricetag */

        .ngg-item-pricetag { display:flex; width:100%; gap:5px; padding:0 5px; color:white; }
        .ngg-item-pricetag div { flex:1; }
        .ngg-db-tag {
            width:100%;
            height: 42px;
            border-top-left-radius:5px;
            border-bottom-left-radius:5px;
            border-bottom-right-radius:30px;
            background: #DA1600;
            background: linear-gradient(90deg, rgba(218, 22, 0, 1) 0%, rgba(197, 26, 0, 1) 59%, rgba(247, 142, 35, 1) 99%);
        }
        .ngg-tag { 
            display:flex;
            border-top-left-radius:5px;
            border-bottom-left-radius:5px;
            border-bottom-right-radius:50px;
            background: #DA1600;
            background: linear-gradient(90deg, rgba(204, 65, 0, 1) 0%, rgba(255, 133, 0, 1) 100%); 
            color:white;
            padding:2px 10px 2px 7px; 
            max-height:40px; 
            align-items:center;
            gap:0 3px;
        }
        .ngg-tag-sold {
            display:flex;
            color:#fff;
            padding:2px 10px 2px 0px; 
            max-height:40px; 
            align-items:center;
            gap:10px;
        }
        .ngg-tag-unlock {
            display:flex;
            border-top-left-radius:5px;
            border-bottom-left-radius:5px;
            border-bottom-right-radius:30px;
            background: rgba(39,136,255,1);
            background: linear-gradient(90deg, rgba(26, 105, 212, 1) 0%, rgba(39, 136, 255, 1) 99%); 
            color:white;
            padding:2px 10px 2px 7px; 
            max-height:40px; 
            align-items:center;
            gap:0 3px;
        }
        .ngg-tag-sold div > img, .ngg-tag div > img, .ngg-tag-unlock div > img { display:block; position: relative; top:4px; border-radius: 0; max-width:42px; }
        .ngg-tag-preview { background: linear-gradient( 270deg , rgba(77, 134, 229, 1) 0% , rgba(16, 97, 205, 1) 100% ); }
        .ngg-savings { font-size:clamp(1.8rem, 2vw, 2rem); font-weight:700; font-style:italic; line-height:0.8; padding-left:0px; }
        .ngg-savings span { font-size:clamp(1.15rem, 1.5vw, 1.5rem); font-style:italic; }
        
        .ngg-db-sm { font-size:12px; line-height:1.25; font-weight:bold; }

.ngg-price-thunder {
 width: 33px;
 height: 43px;
 background: linear-gradient(169deg, rgba(254, 201, 141, 1) 0%, rgba(255, 133, 0, 1) 100%);
}

.ngg-price-percent {
 width: 122.72px;
 height: 36px;
 border-radius: 0 0 0 20px; /* Only 4 values allowed */
 background: 
 linear-gradient(142deg, rgba(255, 133, 0, 1) 0%, rgba(254, 201, 141, 1) 100%),
 linear-gradient(90deg, rgba(236, 60, 0, 1) 0%, rgba(255, 153, 48, 1) 100%);
}


    /* NGG Timeline */
        .ngg-timeline { position:relative; display:flex; flex-direction:column; margin:2% auto; }

        .ngg-timeline-top { position:relative; left:0; top:0; }
        .ngg-timeline-candy { background:url('../imgs/candy_repeat.png') repeat-y left center; background-size:28px; padding-left:25px; }
        .ngg-timeline-line {     
            position: absolute;
            left: 0;
            top: 0;
            bottom: 0;
            width: 4px;
            background: #7c6faa;
            transform: translateX(-50%);
            z-index: 1; 
        }

        .ngg-date-deals {
            display:flex; gap:0px 20px; flex-wrap:wrap; }

        .ngg-date-deals > div { flex:45%; }
        
        .ngg-timeline-item {
            /*display: flex;*/
            /*justify-content: center;*/
            align-items: center;
            margin: 10px 0 1%;
            position: relative;
            z-index: 2;
            width:48%;
            border-radius:100px;
            font-family:'Open Sans', sans-serif;
        }
        .ngg-item-right { align-items: flex-end; }

        .ngg-timeline-date { font-size: clamp(3rem, 3vw, 3.5rem); font-weight:700; }
        .ngg-oo { background-image: linear-gradient( 207deg , rgba(157, 111, 38, 1) 0% , rgba(239, 168, 45, 1) 29% , rgba(253, 242, 209, 1) 51% , rgba(239, 168, 45, 1) 75% , rgba(157, 111, 38, 1) 100% ); 
                    background-clip:text; -webkit-background-clip:text; color:transparent; -web-text-fill-color:transparent; font-weight:900;  }

        /*FREE GIFT*/
        .ngg-free-gift{ display:block; color:#84BB89; font-weight:bold; }
        .ngg-free-gift > img { width:14px; height:14px; }

        .ngg-left { text-align:center; }
        .ngg-shift-left { position:relative; left:calc(-4% - 16px); }
        .ngg-shift-right { position:relative; left:calc(3% + 10px); }
        .ngg-long-txt { position:relative; left:calc(-21% + 11px); }
        .ngg-long-txt2 { position:relative; left:calc(17% + 11px); }
        .ngg-shift-lil { position: relative; left:-6.34%; }

        /* version 2 */
        .ngg-day-active { position:relative; top:0px; left:-55px; text-align:left; }
        .ngg-day-active img { vertical-align:middle; }
        .ngg-day-top { position:relative; top:-10px; left:-25px; text-align:left; }
        .ngg-day-unlock { position:relative; top:0px; left:0px; text-align:left; }
        .ngg-day-active span, .ngg-day-top span { font-size:clamp(2.2rem, 3.2vw, 3.2rem); font-weight:bold; line-height:1; padding-left:20px; color:#fff; }
        .ngg-day-unlock span { font-size:clamp(2.2rem, 3.2vw, 3.2rem); font-weight:bold; line-height:1; color:#fff; }
        .ngg-timeline-date2 { display:flex; justify-content:center; gap:5px; font-size: clamp(3rem, 3vw, 3.5rem); font-weight:700; }
        .ngg-shift-left2 { position:relative; left:calc(-4% - 14px); }
        .ngg-shift-right2 { position:relative; left:calc(18% + 2px); }

        .ngg-opacity70 { opacity:0.7; }
        .ngg-dates { max-width:500px; border:1px solid red; }
               
        .ngg-item-deal { display:flex; flex-direction:column; justify-content:flex-start; padding:1%; width:100%; }
        .ngg-item-deal > div { flex:1; }
        .ngg-item-deal > img { border-radius:50%; max-width:150px; width:100%; padding:0px; vertical-align:middle; }
        .ngg-item-deal.ngg-comingsoon img { border-radius:50%; width:100%; }
        .ngg-item-details { display:flex; gap:10px; flex-direction:column; text-align:left; padding:1% 0 2%; justify-content:space-evenly; }
        .ngg-item-details h3 { color:#fff; }
        .ngg-item-inactive { display:flex; flex-direction:column; text-align:left; padding:5px; justify-content:center; }
        .ngg-img-inactive { padding:0; }
        .ngg-img-inactive img { max-width:120px; max-height:120px; width:100%; margin:6px; background-color:#fff; }
        .ngg-item-price { display:flex; flex-direction: column; gap:5px 20px; padding:0; margin:4px 0 0; align-items:flex-start; justify-content: flex-start; }        
        .ngg-was-price { text-decoration: line-through; color:rgba(247,247,247,1); }
        .ngg-message { padding:1% 0; }
        .ngg-message.ngg-item-expired { background-color:#a4ffff; color:#212121; }
        
        .ngg-learnfaq { color:white; font-size:1.2rem; position:absolute; top:15px; left:8%; }
        .ngg-learnfaq-right { color:white; font-size:1.2rem; position:absolute; top:15px; right:8%; }
        .ngg-learnfaq a, .ngg-learnfaq-right a { padding:0 0 0 5px; text-decoration:underline; }
        .ngg-learnfaq-inactive { position:relative; }
        .ngg-tip { padding-left:5%; }

        .ngg-note { display:flex; width:45.8%; color:#fff; background-color: #2f2403; padding:1%; border-left:3px solid #7b5e13; }
        .ngg-note-txt { flex-grow: 1; line-height:1.3; text-align:left; padding:0 0 0 10px; font-size:clamp(12px, 1.1vw, 1.1rem);}
        .ngg-note-txt a { text-decoration:underline; }
        .ngg-circle {   width: 28px; height: 16px; background-color: #c19419; border-radius: 50%; display: flex; justify-content: center; align-items: center;  }
        .ngg-circle i { color:#2f2403; font-weight:600; font-size:12px; line-height:1; }
        
        .ngg-date-wrapper { 
            position: relative;
        }

        .ngg-date-label {
            background: #2a2a2a;
            color: #ccc;
            padding: 10px 20px;
            border-radius: 12px;
            font-size: 1.8rem;
            font-weight: bold;
            white-space: nowrap;
            box-shadow: 0 4px 12px rgba(0,0,0,0.3);
            position: relative;
            z-index: 2;
            }
        
        .ngg-date-expired { color:#a9a18e; }
        
          .ngg-arrow{
            position:absolute;
            width:0;height:0;
            border-top:15px solid transparent;
            border-bottom:15px solid transparent;
            z-index:2;
            }

            .ngg-arrow2{
            position:relative;
            width:0;height:0;
            border-top:15px solid transparent;
            border-bottom:15px solid transparent;
            z-index:2;
            top:10px;
            } 

            /* Left-pointing */
            .ngg-arrow.ngg-left, .ngg-arrow2.ngg-left{
            top:8px; /* distance from top of container */
            border-right:18px solid #a4ffff;
            padding-left:1.5%;
            }

            .ngg-arrow.ngg-offleft, .ngg-arrow2.ngg-offleft{
            top:8px; /* distance from top of container */
            border-right:18px solid #7c6faa;
            padding-left:1%;
            }

            /* Right-pointing */
            .ngg-arrow.ngg-right, .ngg-arrow2.ngg-right{
            bottom:8px;
            border-left:18px solid #a4ffff;
            padding-right:0%;
            }

            .ngg-arrow.ngg-offright, .ngg-arrow2.ngg-offright{
            bottom:8px;
            border-left:18px solid #7c6faa;
            padding-right:0%;
            }

            .ngg-date-right { padding-left:1%; }
            .ngg-date-right-h2 { padding-left:2.283%; }

        /* Timer */
        .ngg-timer, .ngg-digit-container { display:flex; align-items:center; justify-content:center; font-family:'Open Sans',sans-serif; }
        .ngg-digit-box { background-color:rgba(8,75,166,1); color:white; font-size:clamp(1.5rem, 2vw, 2rem); font-weight:bold; padding:2px 5px; border-radius:6px; min-width:20px; margin:5px 3px; }   
        .ngg-separator { font-weight:800; font-size:clamp(1.5rem, 2.5vw, 2.5rem); margin:auto 3px; }
        .ngg-offer { font-weight:700; padding-right:2px; }

        /* Active */
        .ngg-item-live { background: #309191;
                background: linear-gradient(90deg, rgba(74, 173, 255, 1) 0%, rgba(211, 242, 255, 1) 36%); }
        .ngg-img-live { background-color:#fff2; border-radius:50%; }
        .ngg-date-active { color:#a4ffff; } 
        .ngg-active-soldout { color:rgba(194, 26, 0, 1); font-weight:800; font-style:italic; font-size:2rem; }

        /* Coming Soon */
        .ngg-item-notlive { background-color:rgba(0,42,100,0.7); color:#fff; }
        /*.ngg-item-notlive img { max-width:120px; max-height:120px; background-color:#8399c3; margin:5px; }*/
        .ngg-item-coming h3 { color:#ff8500; font-weight:800; font-style:italic; padding-top:2%; }
        .ngg-date-inactive { color:#7c6faa; }
        .ngg-hidden-deal h3 { color:#ff8500; font-size:clamp(1.5rem, 2vw, 2rem); font-style:italic; }        

        /* Expired */
        .ngg-item-expired { background-color:rgba(29,51,83,0.7); color:#fff; }
        .ngg-item-expired img { opacity:1; }
        .ngg-item-expired > h4 { color:#ff3729; font-weight:800; font-style:italic; font-size:larger; }
        .ngg-soldout { color:rgba(255, 72, 72, 1); font-weight:800; font-style:italic; font-size:clamp(1.5rem, 2vw, 2rem); }
        .ngg-item-soldout h3 { color:#ff3729; font-weight:800; font-style:italic; padding-top:2%; }
        .ngg-db-soldout { color:rgba(255, 72, 72, 1); font-weight:800; font-style:italic; font-size:clamp(1.5rem, 2vw, 2rem); }
            
        .ngg-alert-active { margin:3% auto 1%; }
        .ngg-item-alert { max-width:570px; width:100%; font-size:12px; }
        .alert-body { padding-top:3px; }
        .alert-warning {
            display: -webkit-flex;
                display: flex;
                position: relative;
                margin: 10px 0;
                padding: 10px 0 6px 10px;
                border-radius:4px;
                box-sizing: border-box;
                border-left: 4px solid #74d5ff;
                background: rgba(0,42,100,0.7);
                color: #E5E5E1;
                text-align: left;
                gap:5px;
                
            }
            .alert-warning strong {
                color:#fff;
            }
            .alert-warning a {
            display: inline;
                align-items: center;
            }
            .alert-warning a span {
                text-decoration: underline;
            }
            @media (max-width: 768px) {
                    .alert-warning {
                    width: 98%;
                    left: 2%;
                }
            }

        .ngg-snow1 { position:absolute; top:-14px; left:30px; }    
        .ngg-snow2 { position:absolute; top:-9px; right:30px; z-index:-1; }    
        

        /* Responsive */
        @media (max-width:1000px) {
            .ngg-date-deals { flex-direction:column; }
            .ngg-tab {
                flex: 1 0 160px;
                min-width: 150px;
                padding: 12px 15px;
            }

             .ngg-tab-title {
                font-size: 1.35rem;
            }

            .ngg-tab-date {
                font-size: 1.25rem;
            }

            .ngg-tab.ngg-active .ngg-tab-date {
                font-size: 1.35rem;
            }

            .ngg-content-title {
                font-size: 2rem;
            }

            .ngg-content-desc {
                font-size: 1rem;
            }
            .ngg-shift-left { left:calc(5% - 20px); width:170px; }
            .ngg-shift-right { left:calc(3% - 3px); width:170px; }
            .ngg-shift-right2 { left:calc(6% - 8px); }
            .ngg-timeline-line { width:2px; left:5%; }
            .ngg-timeline-item { width:100%; margin:20px auto 0; }            
            .ngg-arrow.ngg-offleft { border-right:0; border-left:22px solid #a9a18e; }
            .ngg-arrow.ngg-left { border-right:0; border-left:22px solid #a4ffff; }
            .ngg-arrow { left:12%; }
            .ngg-arrow.ngg-offright, .ngg-arrow.ngg-right { left:20px; }
            .ngg-date-right-h2 { padding:0; }
            .ngg-timeline-date2 { justify-content:flex-start; }
            .ngg-learnfaq, .ngg-learnfaq-right { width:500px; top:50%; left:160%; }
            .ngg-note { width:80%; margin:20px auto 2%; }
            .ngg-alert-active { left:0; }
            .ngg-cta2 { margin:5% auto; }
        }


        @media (max-width: 768px) {
            .ngg-tab {
                flex: 1 0 180px;
                min-width: 180px;
                padding: 8px 10px;
            }

            .ngg-tab-title {
                font-size: 1.35rem;
            }

            .ngg-tab-date {
                font-size: 1.25rem;
            }

            .ngg-tab.ngg-active .ngg-tab-date {
                font-size: 1.35rem;
            }

            .ngg-content-title {
                font-size: 2rem;
            }

            .ngg-content-desc {
                font-size: 1rem;
            }
            .ngg-tab-content-container { padding:0 2%; }
            .ngg-timeline-item { width:100%; border-top-left-radius: 100px;  border-bottom-left-radius: 100px; border-top-right-radius: 15px; border-bottom-right-radius: 15px;}
            .ngg-shift-left, .ngg-shift-right { left:0; margin:2% 0 0; }
            .ngg-date-right-h2 { padding-left:9%; }
            .ngg-timeline-line { width:2px; left:2%; }
            .ngg-tab { flex:1 0 170px; min-width:170px; }
            
            .ngg-timeline-line { z-index:0; }
            .ngg-date-right-h2 { padding:0; }
            .ngg-item-details h3, .ngg-item-inactive h3 { font-size:14px; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; }
            .ngg-item-price { align-items:flex-start; flex-direction: column; margin:0; }
            .ngg-item-deal img { max-width:140px; max-height:140px; }
            .ngg-img-inactive img, .ngg-item-deal.ngg-comingsoon img { max-width:80px; max-height:80px; }
            .ngg-item-notlive img { max-width:100px; max-height:100px; padding:5px; }
            .ngg-inactive { display:flex; flex-direction:row; align-items:center; gap:20px; }
            .ngg-tag div > img, .ngg-tag-preview div > img { top:2px; }
            .ngg-buynow { padding:2px 2%; right:10px; bottom:6px; }
            .ngg-arrow.ngg-offleft { border-right:0; border-left:18px solid #7c6faa; }
            .ngg-arrow.ngg-left { border-right:0; border-left:18px solid #a4ffff; }
            .ngg-arrow { left:8px; }
            .ngg-arrow.ngg-offright, .ngg-arrow.ngg-right { left:6px; }
            .ngg-shift-left, .ngg-shift-right { width:130px; }   
            .ngg-long-txt2 { width:90%; }
            .ngg-shift-right2 { left:2%; }  
            .ngg-hidden-deal > h3 { font-size:1.5rem; }                
            .ngg-learnfaq, .ngg-learnfaq-right { width:200px; top:5%; left:120%; }
            .ngg-snow2 { right:0; }
            .ngg-item-deal { align-items:center; }
            .ngg-item-details { padding:1% 0; }
            .alert-body { padding:3px; }
            .ngg-auto-grid { margin:0 1.5%; }
            .ngg-digit-box { padding:2px; margin:5px 1px; border-radius:4px; }
        }
