/* RESPONSIVE */
@media screen and (max-width: 1200px) {
    #body .qc1,#body .qc2{
   		display:none;
	}
}

@media screen and (max-width: 970px) {
    .wrapper{ width:100%; }
    .article-container .main-cat-title {
        padding-left: 10px;
    }
    .nhacai figure figcaption h4 .price-tag{
        display: block;
    }
   
}

@media screen and (max-width: 900px){
    .content-container .nhacai{ margin-top: 0; }
    .nhacai figure figcaption{ clear: both; }
    .nhacai figure > a{ /* width: 100% !important; */ }
    .nhacai figure figcaption h4 .price-tag{ display: inline-block; }
    .nhacai .rate{
        top: initial !important;
        bottom: 65px;
    }
     .addthis_toolbox {
    	display:none;
    }
}

@media screen and (min-width: 821px) {
    .main-menu {
        margin-top: 10px;
    }
    .main-menu ul.item{
        display: none !important;
    }
    .main-menu ul.main,
    .main-menu li.main:hover ul.item{
        display: block !important;
    }
}
@media screen and (max-width: 820px) {
    #header .logo, .main-menu li.main { float: none; }
    #header .logo img {
        margin: 0 auto;
        display: block;
    }
	.nhacai figure figcaption h4 .price-tag {
	  font-size: 15px !important;
	}
    .main-menu .main-menu-button{
        display: block !important;
    }
    .main-menu ul.main {
        width: 100%;
        max-width: 400px;
        position: absolute;
        right: 0;
        z-index: 999;
        box-shadow: -5px 5px 5px -5px #636363;
        margin: 0px;
        padding: 0px;
}
    .main-menu li.main{
        background: #B50D0D;
    }
    .main-menu li.main:hover{
        
    }
    .main-menu li.main:not(:last-child) {
        border-bottom: 1px solid #fff;
    }
    .main-menu li.main a.main {
        font-size: 16px;
    }
	.main-menu li.main a.main {
		  font-size: 16px;
		  color: #fff;
	}
	.main-menu li.main a.main:hover{
		  color:#444;
		}
    .main-menu ul.item {
        position: static;
        padding: 5px 30px;
        display: block;
        box-sizing: border-box;
        width: 100%;
        max-width: 400px;
        border: 0;
    
        margin: 0px;
        padding: 10px;
}

    li.main:last-child ul.item::before,
    li.main:last-child ul.item::after {
        left: initial;
        right: initial;
    }
	ul.item::before {
	  display:none;
	}
    ul.item::before, ul.item::after { top: 63px; }
    li.item:not(:last-child) a.item { border-bottom: 1px dotted #ccc; }

    .content-container{ padding-right: 0; }

    .casino-list-container .casino-list li figure a{
        width: 40%;
    }
    .casino-list-container .casino-list li figure a img {
        width: 100%;
    }
    .casino-list-container .casino-list li figure figcaption{
        width: 60%;
    }

    /* TABLE RESPONSIVE */
    .site-list table, .site-list thead, .site-list tbody, .site-list th, .site-list td, .site-list tr { display: block; }
    .site-list thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
   .site-list td {
        border: none;
        position: relative;
        padding: 5px 0 5px 50%;
    }
   .site-list td::before {
        position: absolute;
        top: 0;
        left: 0;
        width: 45%;
        padding-right: 10px;
        white-space: nowrap;
        line-height: 29px;
        background: rgb(229, 229, 229);
        color: #000;
        height: 100%;
    }

   .site-list td:nth-of-type(1)::before { content: 'RANK'; }
   .site-list td:nth-of-type(2)::before { content: 'NHÀ CÁI'; }
   .site-list td:nth-of-type(3)::before { content: 'KHUYẾN MÃI'; }
   .site-list td:nth-of-type(4)::before { content: 'CHỨC NĂNG'; }
   .site-list td:nth-of-type(5)::before { content: 'ĐIỂM'; }
   .site-list td:nth-of-type(6)::before { content: 'RATING'; }
   .site-list td:nth-of-type(7)::before { content: 'MORE INFO'; }

   .site-list td:nth-of-type(1), td:nth-of-type(1)::before { color: #fff; }

   .site-list td:nth-of-type(1),
   .site-list td:nth-of-type(1)::before {
        background: rgb(182, 24, 24) !important;
        font-weight: bold;
    }
   .site-list td:nth-of-type(3)::before { font-size: 13px; }

   .site-list td.view-all { padding: 0; }
   .site-list td.view-all::before { display: none; }
}
@media screen and (max-width: 730px){
    .article-container .article-list li{
        width: 50%;
        height: 100px;
        padding: 0 7px !important;
    }
	.content-container,.group_sidebar {
		width:100%;
	}
	    .nhacai figure figcaption{ clear: none; }
	.sidebar {
		width: 100%;
		float:left;
	}
    .article-container .article-list li:nth-child(2n+1){
        border-right: 1px solid #dd7a7a;
    }
    .article-container .article-list li:nth-child(2n){
        border-right: 0;
    }
}

@media screen and (min-width: 821px) {
    #body .site-list {
        border: 1px solid #d9d9d9;
    }
    td {
        padding: 5px;
    }
}
@media screen and (min-width: 641px) {
    .article-container .news-list li:nth-child(3n+1){
        width: calc(((100% - 40px))/3 + 10px);
        padding-left:   0;
        padding-right:  10px;
        border-right: 1px solid #dd7a7a;
    }
    .article-container .news-list li:nth-child(3n+2){
        width: calc(((100% - 40px))/3 + 10px);
        padding-left:   10px;
        padding-right:  10px;
        border-right: 1px solid #dd7a7a;
    }
    .article-container .news-list li:nth-child(3n){
        width: calc(((100% - 40px))/3 + 20px);
        padding-left:   10px;
        padding-right:  0;
    }
    
}

@media screen and (max-width: 821px){
    .single-article .banner li figcaption a{
    font-size: 13px !important;

}
@media screen and (max-width: 500px){
    .single-article .banner li figcaption a{
    font-size: 10px !important;
    }
    .single-article .post-content table {
    width: 90% !important;
 	}
 	.single-article .post-content table tr{
    width: 45%;
 	}
 	.single-article .post-content table tr td{
 	}
 	.single-article .post-content table tr td a,.single-article .post-content table tr td *{
 		font-size:10px !important;
 	}
 	.single-article .post-content table tr td strong{
    font-size: 11px;
 	}
}
@media screen and (min-width: 821px){
    /* PRE-RESPONSIVE FIX FOR TABLE */
    th:not(:last-of-type) { border-right: 1px solid rgb(188, 42, 42); }
    tbody tr td:nth-of-type(1) .rank {
        display: inline-block;
        overflow: hidden;
        font-size: 20px;
        line-height: 55px;
        background-size: 100%;
        height: 55px;
        width: 55px;
    }
    .single-article .banner li figcaption a {
  		font-size: 15px !important;
	}

}

/* MOBILE DEVICE */
@media screen and (max-width: 640px) {
    #body .intro p,
    #body .intro img {
        width: 100%;
    }
	#body .intro .banner {
	  width: 100%;
	}
    #body .intro p {
        margin-bottom: 20px;
    }

    .article-container ul li {
        width: 50%;
        height: 350px;
    }


    /* .HIGHLIGHT-POST  */
    .article-container .wrapper > .highlight-post { width: 100%; padding-right: 0; }
    .article-container .feature-post-container  { width: 100%; }
}


@media screen and (max-width: 580px){
    .article-container .article-list li{
        width: 100%;
        padding: 0 20px !important;
        border: none;
    }
	#footer .bottom-menu{
		display:none;
	}
	.rank-star {
    margin: 2px 0px 0px 15px;
	}
	#footer .link{
		display:none;
	}
    .content-container .nhacai .rate {
        width: 130px;
    }

    .nhacai figure figcaption{ clear: both; }
    .nhacai figure > a{ width: 100% !important; }
    .nhacai figure figcaption h4 .price-tag{ display: block; }
    .nhacai .rate{
        top: initial !important;
        bottom: 65px;
    }
}

@media screen and (max-width: 480px) {
    .article-container ul li {
        width: 100%;
        padding: 0 20px;
        height: auto;
    }
    .article-container ul li figure img{
        display: none;
    }

    .bottom-menu ul, .link ul {
        /* display: initial; */
    }
    .bottom-menu ul li {
        width: 100%;
        padding: 5px 0;
    }
    .link span{
        width: 100%;
        display: inline-block;
        padding-bottom: 5px;
    }
    .copyright .link ul li {
        margin: 5px 0;
        width: 50%;
        box-sizing: border-box;
    }
}