/*------------------------------------------------------------------------------------------------------------------------
															MOBILE 52LA
------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:740px) {
    /*----TOP NAV----*/
    .list-item .wrap, .news, .rating-and-other, .footer .wrap {width:684px; margin:0 auto}
    nav .sub-menu {width:580px; left:-100px; right:inherit}
    nav .sub-menu li a {border-right:1px solid rgba(255, 255, 255, 0.22)}
    nav .game:hover .sub-menu, nav .last:hover .sub-menu {top:61px; opacity:1; z-index:200;}

    .user-setting .dropdown {position:absolute; top:130px; opacity:0}
    .user-setting:hover .dropdown {top:67px; opacity:1; z-index:200;}

}
@media screen and (min-width:740px) and (max-width:1080px){
    .list-item ul li{
        width:44%;
    }
    .logo-item.pull-left img {
        width: 100px;
    }
    .info-item h3 {
        margin-top: 10px;
        font-size: 1.3em;
    }
    .info-item .icon-apple{
        font-size: 16px;
    }
    .info-item .icon-android{
        font-size: 16px;
    }
}
@media screen and (min-width:1080px) {

    /*----MAIN----*/
    .wrap, .list-item .wrap, .news, .footer .wrap  {width:1060px; margin:0 auto}
    .banner {display:block}

    .list-item ul li:nth-child(3), .list-item ul li:nth-child(6), .list-item ul li:nth-child(9), .list-item ul li:nth-child(12) {margin-right:0}

    /*----RATING TABLE & FACEBOOK----*/
    .rating-and-other{width:auto;}
    .rating-table {width:570px;}
    .rating-table .tab-pane {color:#fff; padding:10px 30px 10px}
    .other {width:340px; margin-top:0}
    .other .ads {display:block}

    .news-list .col-md-8 {border-right:1px solid #bbb}

    /*----FOOTER----*/
    .footer {}
    .footer .wrap {padding:0}
    .footer .link-ct {display:block}
    .footer .icon-menu {display:none}
    .footer .keyword-ft {width:auto;}

    /*----FIX BUTTON LEFT----*/
    .fixButton {display:block}
    .show-on-phone{ display: none; }
}
@media screen and (max-width:1280px) {
    body:before, body:after {display:none}
}
@media screen and (max-width:740px) {

    /*----TOP NAV----*/
    body {-webkit-transition:all .4s; -moz-transition:all .4s; transition:all .4s;}
    nav .logo {margin-right:20px;}
    nav .nav-user {
        -webkit-transform: translate(240px, 0px);
        -moz-transform: translate(240px, 0px);
        -o-transform: translate(240px, 0px);
        -transform: translate(240px, 0px);
        margin-top:0;
        right:0;
        top:0;
        bottom:0;
        position:fixed;
        width: 240px;
        z-index: 1000;
        background:#004388;
        float:inherit
    }

    nav .nav-user li {display:block; width:100%; border-bottom:1px solid rgba(255,255,255,0.1)}
    nav .nav-user li:last-child {border-bottom:none}
    nav .nav-user li:last-child a.btn-cash {padding:8px 30px!important; font-size:16px; margin:20px !important}

    .open {
        -webkit-transform: translate(-240px, 0px);
        -moz-transform: translate(-240px, 0px);
        -o-transform: translate(-240px, 0px);
        -transform: translate(-240px, 0px);
    }
    .open-left {
        -webkit-transform: translate(240px, 0px);
        -moz-transform: translate(240px, 0px);
        -o-transform: translate(240px, 0px);
        -transform: translate(240px, 0px);
    }

    .sub-menu-dropdown > a {color: #B0E742 !important}
    .sub-menu-dropdown > a:before {width:100%}
    .sub-menu-dropdown .sub-menu {top:61px !important; opacity:1 !important; z-index:200 !important;}
    .sub-menu-dropdown .sub-menu li a {color:#FFF !important}
    .sub-menu-dropdown .sub-menu li a:hover {color: #B0E742 !important}

    .user-mobile {display:block}

    .wrap .page-content {margin:0 20px}

    /*----ITEM----*/
    .list-item ul li {border-top:1px solid #c6c6c6; width:100%; padding:20px 20px; margin:0}
    .list-item ul li:first-child {border-top:0; padding-top:0}

    /*----RATING TABLE & FACEBOOK----*/
    .nav-tabs,.nav-pills {position:relative}
    .rating-and-other {border-top:0; padding:0 }
    .rating-table .nav-tabs li {width:100%; border-left:none}
    .rating-table .nav-tabs li.active:after, .rating-table .nav-tabs li.active:before {display:none}
    .rating-table .nav-tabs > li > a {padding:10px 20px}

    /*----MENU FAQ----*/
    .tab-menu {
        -webkit-transform: translate(-240px, 0px);
        -moz-transform: translate(-240px, 0px);
        -o-transform: translate(-240px, 0px);
        -transform: translate(-240px, 0px);
        left:0;
        top:0;
        bottom:0;
        position:fixed;
        width: 240px;
        background:#004388;
    }

    .tab-menu #faq-tab > li {font-size:14px; border-top-color:#537CA6}
    .faq-body .tab-menu h3 {display:none}
    #faq-tab>li>a {color:rgba(255,255,255,0.75)}
    #faq-tab>li>a:hover, #faq-tab>li.active>a {color:#fff}
    .ico-mn-faq {
        display:block;
        position: absolute;
        z-index: 100;
        font-size:24px;
        background: #888888;
        padding: 10px;
        left: -20px;
        top: 20px;
        color: rgba(255, 255, 255, 0.7);
        line-height: 31px;
        cursor:pointer;
    }

    .gameplay-tab li {float:inherit;; text-align:center}
    .gameplay-tab li:hover {border:none}
    .gameplay-tab li a {border:none !important}

    /*----GROUP----*/
    .group .list-item .wrap {width:96%; margin:0 2%}
    .group .group-tab {background:#272727}
    .group .group-tab > li {float: initial; text-align: center}
    .group .group-tab > li > a, .group .group-tab > li:hover > a, .group .group-tab > li:focus > a {color:rgba(255, 255, 255, 0.7)}
    .group .group-tab > li.active > a, .group .group-tab > li.active:hover > a {background:#B0E742; color:#0d0c51; border-radius:0}
    .group .group-tab > li:last-child a, .group .group-tab > li:last-child:hover a {background:none; color:rgba(255, 255, 255, 0.7)}
    .group .list-item > .wrap > ul li {width:96%; padding: 15px 2%;}

    /*----MODAL----*/
    #usersetting .nav-tabs {text-align: center}
    #usersetting .nav-tabs li {float:initial; text-align:center; display:inline-block}
    #usersetting .nav-tabs li.active a {color:#fbf3ae !important}
    #usersetting .nav-tabs li a {padding:0 10px 10px}
    #usersetting .nav-tabs li.active a, #usersetting .nav-tabs li a:hover {background:none; border-color:rgba(255,255,255,0)}
}
@media screen and (max-width:640px) {
    .faqContent .mobile-qrcode {float:inherit !important; clear:both; width:100%; text-align:center}
    .faqContent .mobile-qrcode > p {text-align:center; padding-top:20px}
    .faqContent .qrcode-box {margin:0 auto}
    .user-info .avatar {width:80px; height:80px}
    .btn-func button {width:100%}
    .news{width:auto; height:43px}
    .hide-on-phone{ display: none; }
    .show-on-phone{ display: block; }
}
@media screen and (max-width:360px) {
    .logo-item a {width:120px}
    .logo-item a img {max-width:100%}
    .info-item h3 {margin-top:0; font-size:21px}
    .btn-primary {padding:10px 15px 8px;}
    .news{width:auto; height:43px}
    .hide-on-phone{ display: none; }
    .show-on-phone{ display: block; }
}


/*------------------------------------------------------------------------------------------------------------------------
															THEME
------------------------------------------------------------------------------------------------------------------------*/
.list-item .wrap {padding:30px 30px 0;}
.rating-and-other .wrap {padding:30px}
/*.rating-table {width:57%}*/
.rating-table .nav-tabs, .other .fl-social {border-radius:5px }
.rating-table .nav-tabs li.active:first-child a{
    border-radius: 5px 0px 0px 5px;
}
.rating-table .tab-pane {padding: 20px 0px 10px;}


.footer {padding:0}
.footer .wrap {background:rgba(0,0,0,0.7); padding:20px 30px}
.footer .keyword-ft ul li > a {}