﻿/* ----------Tabet--------- */

/* Responsive */

@media(max-width: 767px) {
    .layout-top .center-col,
    .layout-top .right-col,
    .TD-div-module-right {
        width: 100%
    }
    .bottom-nav li:not(:first-child){
		display: none;
	}
    .center-col .tandan-div-module-links-img,
    .img-link-m-50 .tandan-div-module-links-img {
        display: flex;
        flex-wrap: wrap;
    }
    .img-link-m-50 .tandan-div-module-links-img {
        margin: 0 -5px; width:auto; min-width: 100%;
    }
    .img-link-m-50 .tandan-div-module-links-img a {
        padding: 0 5px
    }
    .center-col .tandan-div-module-links-img a,
    .img-link-m-50 .tandan-div-module-links-img a {
        display: inline-block;
        margin-bottom: 5px;
        float: left;
        width: 50%;
    }
    .center-col .tandan-div-module-links-img a img {
	    width: 100%;
	    margin: 0px !important;
	}

    .subsites_pb li {
        white-space: normal !important;
    }
    .tandan-div-body,
    .tandan-div-banner,
    .tandan-div-banner *,
    .tandan-div-banner img,
    .Td-footer-text,
    .layout-top,
    .TD-main-left,
    .TD-main-right,
    .TD-div-module-left,
    .TD-div-module-center {
        width: 100% !important;
        height: auto !important
    }
    .Td-footer-nav,
    .banner-FAQ-TH img {
        width: 100% !important
    }
    .tandan-div-banner img,
    .banner-FAQ-TH {
        height: auto !important
    }
    .tandan-div-nav-top {
        background-image: none !important;
    }
    .tandan-nav-FAQ {
        margin-top: -3px;
        background: #a40607;
    }
    .menu-toggle-mobile.toggle-menu-mobile {
        position: fixed;
        top: 0;
        bottom: 0;
        /*right: 100%;*/
        background: #fff;
        z-index: 2;
        max-width: 300px;
        box-shadow: 0px 2px 10px #000;
        transform: translateX(calc(-100% - 8px));
        -webkit-transform: translateX(calc(-100% - 8px));
        -o-transform: translateX(calc(-100% - 8px));
        transition: all ease .3s;
        -webkit-transition: all ease .3s;
        -o-transition: all ease .3s;
    }
    .menu-toggle-mobile.toggle-menu-mobile.active {
        right: auto;
        left: 0;
        transition: all ease .3s;
        -webkit-transition: all ease .3s;
        -o-transition: all ease .3s;
        transform: translateX(0px);
        -webkit-transform: translateX(0px);
        -o-transform: translateX(0px);
    }
    .menu-toggle-mobile.toggle-menu-mobile.active .toggle-mobile-content {
        overflow: hidden;
        overflow-y: auto;
        position: absolute;
        top: 0;
        /*left: 0;*/
        width: calc(100% - 10px);
        height: 100%;
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu {
        display: block !important;
        position: absolute;
        left: 100%;
        height: 40px;
        width: 50px;
        background: orange;
        top: 0;
        padding: 5px 8px;
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu div {
        width: 100%;
        height: 5px;
        background: white;
        margin: 4px auto;
        transition: all 0.3s;
        backface-visibility: hidden;
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu.on .one {
        transform: rotate(45deg) translate(5px, 5px);
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu.on .two {
        opacity: 0;
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu.on .three {
        transform: rotate(-45deg) translate(7px, -8px);
    }
    .tandan-div-module-news-article img {height: auto !important;}
    .Td-footer-nav {padding: 0 8px;}
    .Td-footer-text {
        padding: 10px;
        margin-top: 0 !important;
    }
    .layout-top {position: relative; left: 0; right: 0}
	.home-main {margin-top: 0}
	.featured ul.ui-tabs-nav{padding-left: 0}
	.TD-box-news, .TD-quangcao, .TD-table-module-border-default{margin-right: 0}
    .head-news-cover-wrapper h2 a {
        font-size: 17px;
        line-height: 22px;
    }
}


/* ----------Mobile--------- */

@media(max-width: 580px) {
    .TD-FAQ-main-right,
    .TD-FAQ-main-left,
    .TD-main-FAQ-solid {
        width: 100%;
    }
    .TD-FAQ-main-right,
    .TD-FAQ-main-left {
        padding: 5px 10px;
        float: left
    }
    .tandan-div-nav-top img {
        padding-left: 8px !important;
    }
    .tandan-div-nav-top a {
        background: #fff
    }
    .featured ul.ui-tabs-nav,
    .featured .ui-tabs-panel {
        width: 100% !important
    }
    .featured ul.ui-tabs-nav {
        left: 0 !important;
        order: 2;
    }
    .featured .ui-tabs-panel{order: 1;}
    .featured ul.ui-tabs-nav {
        position: relative !important
    }
    .tandan-div-module-news-main .featured,
    .featured .ui-tabs-panel img {
        max-height: max-content
    }
    .TD-div-module-center .tabnav {
        height: auto;
        display: inline-block;
    }
    .tabnav li a {
        border-top: 2px solid transparent !important;
    }
}

@media(max-width: 480px) {
    .menu-toggle-mobile.toggle-menu-mobile {
        max-width: calc(100% - 50px);
    }
    .TD-box-news-main .tandan-div-module-news-bottom, .TD-box-news-main, .TD-box-news-main>table{
		width:100%; display: inline-block
	}
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu {
        width: 35px;
        height: 28px;
        padding: 2px 6px;
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu div {
        height: 3px;
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu.on .one {
        transform: rotate(45deg) translate(5px, 3px);
    }
    .menu-toggle-mobile.toggle-menu-mobile .btn-toggle-menu.on .three {
        transform: rotate(-45deg) translate(7px, -5px);
    }
}