

/* ==========================================================================
            Visiblity classes
========================================================================== */



@media (min-width:0px) and (max-width:650px) {

    .s-visible-1  > :nth-child(n+2) {display: none;}
    .s-visible-2  > :nth-child(n+3) {display: none;}
    .s-visible-3  > :nth-child(n+4) {display: none;}
    .s-visible-4  > :nth-child(n+5) {display: none;}
    .s-visible-5  > :nth-child(n+6) {display: none;}
    .s-visible-6  > :nth-child(n+7) {display: none;}
    .s-visible-7  > :nth-child(n+8) {display: none;}
    .s-visible-8  > :nth-child(n+9) {display: none;}
    .s-visible-9  > :nth-child(n+10) {display: none;}
    .s-visible-10 > :nth-child(n+11) {display: none;}
    .s-visible-11 > :nth-child(n+12) {display: none;}
    .s-visible-12 > :nth-child(n+13) {display: none;}
    .s-visible-13 > :nth-child(n+14) {display: none;}
    .s-visible-14 > :nth-child(n+15) {display: none;}
    .s-visible-15 > :nth-child(n+16) {display: none;}

}
@media (min-width:651px) and (max-width:950px) {

    .t-visible-1  > :nth-child(n+2) {display: none;}
    .t-visible-2  > :nth-child(n+3) {display: none;}
    .t-visible-3  > :nth-child(n+4) {display: none;}
    .t-visible-4  > :nth-child(n+5) {display: none;}
    .t-visible-5  > :nth-child(n+6) {display: none;}
    .t-visible-6  > :nth-child(n+7) {display: none;}
    .t-visible-7  > :nth-child(n+8) {display: none;}
    .t-visible-8  > :nth-child(n+9) {display: none;}
    .t-visible-9  > :nth-child(n+10) {display: none;}
    .t-visible-10 > :nth-child(n+11) {display: none;}
    .t-visible-11 > :nth-child(n+12) {display: none;}
    .t-visible-12 > :nth-child(n+13) {display: none;}
    .t-visible-13 > :nth-child(n+14) {display: none;}
    .t-visible-14 > :nth-child(n+15) {display: none;}
    .t-visible-15 > :nth-child(n+16) {display: none;}

}
@media (min-width:951px) and (max-width:1200px) {

    .w-visible-1  > :nth-child(n+2) {display: none;}
    .w-visible-2  > :nth-child(n+3) {display: none;}
    .w-visible-3  > :nth-child(n+4) {display: none;}
    .w-visible-4  > :nth-child(n+5) {display: none;}
    .w-visible-5  > :nth-child(n+6) {display: none;}
    .w-visible-6  > :nth-child(n+7) {display: none;}
    .w-visible-7  > :nth-child(n+8) {display: none;}
    .w-visible-8  > :nth-child(n+9) {display: none;}
    .w-visible-9  > :nth-child(n+10) {display: none;}
    .w-visible-10 > :nth-child(n+11) {display: none;}
    .w-visible-11 > :nth-child(n+12) {display: none;}
    .w-visible-12 > :nth-child(n+13) {display: none;}
    .w-visible-13 > :nth-child(n+14) {display: none;}
    .w-visible-14 > :nth-child(n+15) {display: none;}
    .w-visible-15 > :nth-child(n+16) {display: none;}

}
@media (min-width:1201px) and (max-width:1370px) {

    .l-visible-1  > :nth-child(n+2) {display: none;}
    .l-visible-2  > :nth-child(n+3) {display: none;}
    .l-visible-3  > :nth-child(n+4) {display: none;}
    .l-visible-4  > :nth-child(n+5) {display: none;}
    .l-visible-5  > :nth-child(n+6) {display: none;}
    .l-visible-6  > :nth-child(n+7) {display: none;}
    .l-visible-7  > :nth-child(n+8) {display: none;}
    .l-visible-8  > :nth-child(n+9) {display: none;}
    .l-visible-9  > :nth-child(n+10) {display: none;}
    .l-visible-10 > :nth-child(n+11) {display: none;}
    .l-visible-11 > :nth-child(n+12) {display: none;}
    .l-visible-12 > :nth-child(n+13) {display: none;}
    .l-visible-13 > :nth-child(n+14) {display: none;}
    .l-visible-14 > :nth-child(n+15) {display: none;}
    .l-visible-15 > :nth-child(n+16) {display: none;}

}
@media (min-width:1371px) and (max-width:1700px) {

    .xl-visible-1  > :nth-child(n+2) {display: none;}
    .xl-visible-2  > :nth-child(n+3) {display: none;}
    .xl-visible-3  > :nth-child(n+4) {display: none;}
    .xl-visible-4  > :nth-child(n+5) {display: none;}
    .xl-visible-5  > :nth-child(n+6) {display: none;}
    .xl-visible-6  > :nth-child(n+7) {display: none;}
    .xl-visible-7  > :nth-child(n+8) {display: none;}
    .xl-visible-8  > :nth-child(n+9) {display: none;}
    .xl-visible-9  > :nth-child(n+10) {display: none;}
    .xl-visible-10 > :nth-child(n+11) {display: none;}
    .xl-visible-11 > :nth-child(n+12) {display: none;}
    .xl-visible-12 > :nth-child(n+13) {display: none;}
    .xl-visible-13 > :nth-child(n+14) {display: none;}
    .xl-visible-14 > :nth-child(n+15) {display: none;}
    .xl-visible-15 > :nth-child(n+16) {display: none;}

}
@media (min-width:1701px){

    .xxl-visible-1  > :nth-child(n+2) {display: none;}
    .xxl-visible-2  > :nth-child(n+3) {display: none;}
    .xxl-visible-3  > :nth-child(n+4) {display: none;}
    .xxl-visible-4  > :nth-child(n+5) {display: none;}
    .xxl-visible-5  > :nth-child(n+6) {display: none;}
    .xxl-visible-6  > :nth-child(n+7) {display: none;}
    .xxl-visible-7  > :nth-child(n+8) {display: none;}
    .xxl-visible-8  > :nth-child(n+9) {display: none;}
    .xxl-visible-9  > :nth-child(n+10) {display: none;}
    .xxl-visible-10 > :nth-child(n+11) {display: none;}
    .xxl-visible-11 > :nth-child(n+12) {display: none;}
    .xxl-visible-12 > :nth-child(n+13) {display: none;}
    .xxl-visible-13 > :nth-child(n+14) {display: none;}
    .xxl-visible-14 > :nth-child(n+15) {display: none;}
    .xxl-visible-15 > :nth-child(n+16) {display: none;}
}

/* ==========================================================================
                fixed mystery box banner 
   ========================================================================== 
*/

   /*
    * fixed-mysterbox-stats
    */


   	.fmb-stats-loader {
	   	border-radius: var(--cx-radius-sm);
	    padding: 15px;
	    background-color: #1D1537;
	    color: var(--e-primary);
   	}
    .fmb-stats-loader .cx-bar-loader{border-radius: var(--cx-radius-sm);}
   

   /*
   * fmb-stats-countdown-expiry
   */


    .fmb-stats-countdown-expiry-loader{
    	border-radius: var(--cx-radius-sm);
	    padding: 15px;
    	background-color: #31110C;
    	color: #F97066;
    }
    .fmb-stats-countdown-expiry-loader .cx-bar-loader{
    	background-image:linear-gradient( to right, 
            hsl(4.08deg 92.45% 68.82%) 0%, 
            hsl(4.08deg 92.45% 73.82%) 0%, 
            hsl(4.08deg 92.45% 68.82%) 30%, 
            hsl(4.08deg 92.45% 73.82%) 100% 
        );
        border-radius: var(--cx-radius-sm);
    }
    .fmb-stats-loader .cx-bar-loader.heading,
    .fmb-stats-countdown-expiry-loader .cx-bar-loader.heading,
    .fmb-ui-action-button .cx-bar-loader.heading{
        height:15px !important;
        max-height:15px !important;
        min-height:15px !important;    
    }
    .fmb-stats-loader .cx-bar-loader.text,
    .fmb-stats-countdown-expiry-loader .cx-bar-loader.text,
    .fmb-ui-action-button .cx-bar-loader.text{
        height:10px !important;
        max-height:10px !important;
        min-height:10px !important; 
    }

    /*
    */
    .fmb-stats-loader .cx-block-container.flow-HORIZONTAL{
        flex-direction:row !important;
        flex: 1;
    }
    @media only screen and (min-width: 950px) {
        .game-stats-tray .fmb-stats-loader{width:60%;}
        .game-stats-tray .stat-box-loader-countdown {width:40%;}
    }

    @media only screen and (max-width: 949px) {
        .game-stats-tray .fmb-stats-loader,
        .game-stats-tray .stat-box-loader-countdown {width:100%;}
    }



    .stats-container .single-loading-item .cx-block-container{
        gap:10px !important;
    }


    /*  */

    .stat-box-loader-countdown *{
        border-radius:5px;
        color:white;
    }
    .stat-box-loader-countdown {
        min-width:200px;
        padding:15px;
        background:#31110C;
        border-radius:5px;
    }



    /*
	*.fmb-ui-action-button
    */


    .fmb-ui-action-button{background-color: white;padding: 10px 20px;max-width: 235px;border-radius: var(--cx-radius-sm);}
	.fmb-ui-action-button .cx-bar-loader{border-radius: var(--cx-radius-sm);}
    @media (max-width: 767px) {
        
     .fmb-ui-action-button > div > div { flex-direction:row!important; }
     .cx-block-container.flow-VERTICAL.story-btn > div > div {flex-direction: row !important;}
     .fmb-ui-action-button-container {flex-direction: row!important;}
    }



    /*for loader template to show in full width*/
    .fixedmystery-product-page-ui.status-active .stats-container .ajax_shortcode:not(.ajax_shortcode[data-cx_shortcode="fixedmystrybox_stats_countdown_start"]),
    .fixedmystery-product-page-ui.status-expired .stats-container .ajax_shortcode:not(.ajax_shortcode[data-cx_shortcode="fixedmystrybox_stats_countdown_start"]){flex:auto;}

    .fixedmystery-product-page-ui.status-coming-soon .stats-container .ajax_shortcode:not(.ajax_shortcode[data-cx_shortcode="fixedmystrybox_stats_countdown_expiry"])
    {flex:auto;}

    /* for story btn and play  */
    .cx-block-container.flow-VERTICAL.fmb-ui-action-button{width:60%;}
    .cx-block-container.flow-VERTICAL.story-btn{width: 40%;}
    .cx-block-container.flow-VERTICAL.story-btn{border:2px solid white;padding:10px 20px;border-radius:5px;}
    .story-btn .cx-block-container.flow-HORIZONTAL { width:100%;}
    .story-btn .cx-bar-loader {border-radius:5px;}   



/*********************************************************
* featured fixed mysterbox
**********************************************************/

    .single-loading-item.featured_fixedmysterybox_loader{background-color: var(--e-primary-dark);border-radius: 5px; margin:20px; flex-direction: row !important;}
    .single-loading-item.featured_fixedmysterybox_loader .bars {padding: 20px;}
    .single-loading-item.featured_fixedmysterybox_loader .game_box {height: 100%;transform: scale(1.4);}
    .single-loading-item.featured_fixedmysterybox_loader .game_box .cx-block-container div{margin:-0.19px;}




/*  ==========================================================================
               shortcode mysterybox_ui_action_button loader btns
    ========================================================================== */


.ajax_shortcode[data-cx_shortcode="mysterybox_ui_action_button"] .loading-box-container{width: auto!important;display: inline-grid!important;}
   
@media screen and (max-width: 600px) { 
    .ajax_shortcode[data-cx_shortcode="mysterybox_ui_action_button"] .loading-box-container{width: 100%!important;}
    .ajax_shortcode[data-cx_shortcode="mysterybox_ui_action_button"] .loading-box-container .single-loading-item{
        display:flex;justify-content:center;
    }
}


/* ==========================================================================
                for page: event early launch sc =>event_calendar
   ========================================================================== 
*/

.calendar_stats_infobox{border: 1px solid #2b1d56; border-radius: 10px;margin: 15px 0;   }    




/* ==========================================================================
                    for story page loader template
   ========================================================================== */        



   .cx-block-container.flow-VERTICAL.st_main_loader_template {
        max-width: 100%;
        min-height: 380px;

        background-image: linear-gradient( to right, 
            hsl(255deg 50% 20%) 0%,
            hsl(255deg 50% 25%) 0%,
            hsl(255deg 50% 20%) 30%,
            hsl(255deg 50% 25%) 100% );
        background-size: 200% 100%;
        animation: bgPos 1s linear infinite;
        padding: 15px;
        border-radius: 10px;
    }
   


/* ==========================================================================
                    for loayal featured section in gem shop
   ========================================================================== */      




    .cx-block-container.flow-VERTICAL.gem_shop_featured{
        min-height: 180px;
    } 
    .cx-block-container.flow-VERTICAL.loyalty_img_container {
        min-width: 100%;
        min-height: 150px;
        background-image:linear-gradient( to right, #2c1e53 0%, hsl(255deg 45.21% 19.63%) 0%, hsl(255deg 50.23% 24.91%) 30%, hsl(255deg 48.62% 20.24%) 100% );
        /*background-image:linear-gradient( to right, hsl(255deg 50.72% 27.27%) 0%, hsl(255deg 50.39% 18.25%) 0%, hsl(255deg 50% 20%) 30%, hsl(255deg 50.07% 17.94%) 100% );*/
        background-size: 200% 100%;
        animation: bgPos 1s linear infinite;
    }

    .cx-block-container.flow-VERTICAL.loyalty_title {min-width: 100%;min-height: 15px;
        background-image:linear-gradient( to right, #2c1e53 0%, hsl(255deg 45.21% 19.63%) 0%, hsl(255deg 50.23% 24.91%) 30%, hsl(255deg 48.62% 20.24%) 100% );
        
        /*background-image: linear-gradient( to right, hsl(255deg 50.72% 27.27%) 0%, hsl(255deg 50.39% 18.25%) 0%, hsl(255deg 50% 20%) 30%, hsl(255deg 50.07%  17.94%) 100% );background-size: 200% 100%;animation: bgPos 1s linear infinite*/
    }
    .cx-block-container.flow-VERTICAL.loyalty_button {min-width: 100%;}
    .cx-block-container.flow-VERTICAL.loyalty_button .cx-bar-loader {
        min-width: 100%;
        background-image:linear-gradient( to right, #2c1e53 0%, hsl(255deg 45.21% 19.63%) 0%, hsl(255deg 50.23% 24.91%) 30%, hsl(255deg 48.62% 20.24%) 100% );
        /*background-image: linear-gradient( to right, hsl(255deg 50.72% 27.27%) 0%, hsl(255deg 50.39% 18.25%) 0%, hsl(255deg 50% 20%) 30%, hsl(255deg 50.07% 17.94%) 100% );*/
        border-radius:5px;
        background-size: 200% 100%;
        animation: bgPos 1s linear infinite;
    }


/**
 * empty loader
 * */
.empty_loader{
    display:none!important;
}

/*for hiding addtional rewards loader in myster-box page*/
.box-img-container .ajax_shortcode[data-cx_shortcode='game_additional_reward'] .loading-background {display:none;}


/* loader for recent blog style collection */

.cx-block-container.blogs_style_recent_blogs_loader .cx-bar-loader.blog_image,
.cx-block-container.blogs_style_list .image{border-radius:6px;}

.cx-block-container.blogs_style_recent_blogs_loader .blog_tags,
.cx-block-container.blogs_style_grid .blog_tags{border-radius:16px;}


.cx-block-container.blogs_style_recent_blogs_loader,
.cx-block-container.blogs_style_grid {border-radius: var(--cx-radius-xs);transition: var(--card-transition);margin: 0 auto; padding: 11px;}
.cx-block-container.blogs_style_grid{background-color: var(--e-body-secondary-bg);}


.cx-block-container.blogs_style_list{min-height: 80px;}
.cx-block-container.blogs_style_recent_blogs_loader{min-height: 250px;}
/*recent blog loader in mobile */
@media (max-width: 767px) {
    .blogs_style_recent_blogs_loader .cx-block-container.blog_image{order: 1;min-height: 250px;}
    .blogs_style_recent_blogs_loader .cx-block-container.blog_content{order: 2;}
    .blogs_style_recent_blogs_loader .cx-block-container.flow-HORIZONTAL { flex-direction: row!important; }
}


/* ==========================================================================
   type credit loader
   ========================================================================== */

.box_grid_item.type-credit.single-load_template{background-color: var(--e-header-bg);padding:10px;border-radius: var(--cx-radius-xl);}


/* ===========================================================================
     for curency collection grid loader
   ===========================================================================*/



.cx-block-container.currency_grid_loader {
    padding: 30px;margin: 5px;align-items: center;max-height: 340px;border-radius: 10px;border: 2px solid var(--e-primary-dark);
}
