@-o-viewport {
    width: device-width;
}
@-ms-viewport {
    width: device-width;
}
@viewport {
    width: device-width;
}

@media(max-width: 1920px) {
    .banner { padding-top: 120px; padding-bottom:30%; }
}

@media(max-width: 1366px) {
    .banner { padding-top:90px; padding-bottom:490px; }
    .stats .icon-trophy {width: 60%; left: -100px; top: 340px;}
}

@media (max-width: 1199px) {
    .tarneeb img{width: 44%;}

    .banner { padding-top:120px; padding-bottom:430px; }
    .banner .content-block h3 { font-size: 32px; }
    
    .header-navigation { margin-bottom: 0; }
    .logo-box { width:100%;float:none;margin:0!important; }
    .navigation-box { margin:0; }
    .navbar-expand-lg .menu-toggler{display:block;background-color:transparent!important;color:#fff;border:none;font-size:28px;float:right;outline:none;cursor:pointer;border-color:#fff;margin:23px 0;}
    .navbar-expand-lg .navbar-collapse{overflow:auto!important;width:100%;display:none!important;background:#000;transition:all .5s ease;height:0;margin:0;padding:0!important;}
    .navbar-expand-lg .navbar-collapse.showen{display:block!important;height:auto;max-height:70vh;}
    .header-navigation .nav>li.show-mobile{display:none;}
    .header-navigation .container{display:block;padding-right:15px;padding-left:15px;position:relative;}
    .header-navigation .container .logo-box .navbar-brand{float:left;background-color:transparent;padding:20px 0;}

    .banner .content-block .app-btn-container { top: 30px; }

    .header-navigation .container .logo-box .navbar-toggler{float:left;}
    
    .icon-vip {z-index: -1;}
    
    .stats {padding: 26px 0 22px; height: auto;}
    .stats .block-title {margin-top: 104px;}
    
    .ranking .icon-ranking{width: 52%;}

    .features .phone-1 {
        width: 75%;
        top: -20px;
    }

    .features .phone-2 {
        width: 75%;
        top: -190px; 
    }
}

@media (max-width: 1024px) {}
@media(max-width: 991px) {
    .header-navigation .container .logo-box{position:relative;top:0;left:0;-webkit-transform:translateY(0);-ms-transform:translateY(0);-o-transform:translateY(0);transform:translateY(0);float:none;padding-right:20px!important;}
    
    .tarneeb img { width: 44%; }
    .banner { padding-top: 100px; padding-bottom: 410px; }

    .banner .content-block h3{font-size:22px;line-height:22px;margin-bottom:25px;}
    .inner-banner{padding-top:200px;}

    .list-features{width: 74%;}
    .icon-vip{bottom: 0px;z-index: -1;}

    .stats{padding: 0px 0 0; height: auto; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}
    .stats p{font-size: 14px;}
    .stats .icon-trophy{ top: 210px;}
    .stats .single-stats-one{-webkit-background-size: 100% 100%;-moz-background-size:100% 100%;-o-background-size:100% 100%;background-size:100% 100%; width: 160px; height: 160px}
    .stats .single-stats-one h3{font-size: 28px;line-height: 158px;}
    .stats .block-title{margin-top: 49px;}
    
    .ranking .icon-ranking{width: 45%;right: -60px;bottom: -151px;}
    
    .block-title{margin-bottom: 30px;}
    .block-title h2 {font-size: 32px;z-index: 999;position: relative;}
    .block-title h3{padding: 0 180px; padding: 0 130px;}

    .ranking{padding: 60px 0 30px;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}

    .ranking .block-title{margin-top: 20px;}
    .ranking-item .user-photo img{width: 140%; max-width: 140%;}
    .ranking-item {font-size: 14px;}
    .ranking-item .icon-coins{width: 200%; margin-left: -15px;}

    .icon-star{width: 50%;left: -40px;bottom: -118px; }
    .icon-cards{width: 80%; bottom: 180px;z-index: -1;}
    
    .download .app-btn{padding-left: 40px;padding-right: 10px;}
    .download .app-btn i{font-size: 20px;left: 15px;}

}


@media(max-width: 768px) {
    .tarneeb img { width: 55%; }

    .banner {
        padding-top: 100px;
        padding-bottom: 280px;
        background-size: contain;
        background-position: 0 300px;
    }

    .banner .game-table { top: 77%; }
    .banner .card-a     { top: 70%; }
    .banner .card-5     { top: 84%; }
    .banner .card-7     { top: 76%; }

    .block-title h3{padding: 0 30px; font-size: 16px;}
    .list-features{margin-top: -75px;margin-bottom: 55px;}
    .icon-vip{width: 95%;bottom: 70px;}
    .stats .icon-trophy{display: none;}

    .ranking-item .user-photo img{width: 35px;height: 35px; max-height: 100%; max-width: 100%;}
    .ranking-item .flag{width: 40px;}
    .ranking-item .icon-coins{width: 40px;margin-left: 0px;}

    .col-position {
        width: 35px !important;
        margin-left: 5px;
    }

    .list-features li p{padding-right: 0;}
    .rankcol{float: left;width: auto;padding-left: 5px;padding-right: 5px;font-size: 14px;}
    
    .stats{padding: 10px 0 50px;}
    .stats .single-stats-one{width: 130px;height: 130px;}
    .stats .single-stats-one h3{line-height: 130px;}
    
    .ranking .icon-ranking{bottom: -86px;}

    .banner .content-block .app-btn-container { top: 10px; }

    .wallfame{-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size:cover}
    
    .download {padding-bottom: 35px;}
    .icon-cards{width: 70%;bottom: -10px;}

}

@media(max-width: 480px) {
    .tarneeb { margin-bottom: 10px; }
    .stats p { font-size: 13px; }
    .stats .single-stats-one{ width: 110px;height: 110px; }
    .stats .single-stats-one h3{ font-size: 22px;line-height: 112px; }
    
    .list-features {
        margin-top: -40px;
        width: 100%;
    }

    .download .app-btn + .app-btn {
        margin-left: 0;
    }

    .icon-vip{display: none;}

    .ranking .icon-ranking{right: -27px;}
    .ranking .title {font-size: 14px;}
    .ranking .heading { display: none;}
    .ranking-item .icon-coins{display: none;}

    .icon-star{left: -15px;bottom: -87px;}

    .banner .content-block .app-btn   {padding-left: 40px;padding-right: 15px;}
    .banner .content-block .app-btn i {font-size: 24px; left: 12px;}

    .banner .game-table { top: 72%; }
    .banner .card-a     { top: 67%; }
    .banner .card-5     { top: 77%; }
    .banner .card-7     { top: 71%; }

    .features .phone-1 {
        width: 60%;
    }

    .features .phone-2 {
        width: 60%;
        top: -140px;
        left: 160px;
    }

}

@media(max-width: 375px) {}


@media(max-width: 320px) {
    .header-navigation .container .logo-box {padding-right: 0 !important;}
}