#splitPage>div{
    display: inline-flex;
    justify-content: center;
    flex-wrap: wrap;
}
@media (max-width:991px) {
    body { 
        position : relative;
        min-height: 100vh;
    }
    section {
        min-height: calc(100vh - 117px);
    }
    body .wid50 {
        width: 100% !important;
    }
    #topBar {
        display: none;
        
    }
    /* index */
    #logo {
        width: 80px;
        height: 30px;
        position: absolute;
        left: 0;
        right: 0;
        margin: auto;
    }
    #logo.active {
        position: fixed;
        z-index: 900;
        left: 16px;
        margin: 0;
        top: 15px;
    }
    .input-select {
        display: none;
    }
    #Header .collapse.navbar-collapse {
        position: fixed;
        width: 80vw;
        height: 0;
        left: 0;
        top: 0;
        height: 0;
        overflow: hidden;
        box-shadow: 0 0 15px -7px #ccc;
        display: block;
        background-color: #4066b8 ;
        z-index: 500;
        transition: all .4s;
    }
    
    #Header .collapse.navbar-collapse.active{
        height: 100vh;
        padding:60px 0px 0;
    }
    #Header .menu-fiexd {
        width: 100%;
        height: 100%;
        padding: 0 16px;
        background-color: #fff;

    }
    #Header .menu-list .navbar-nav *{
        color: #666;
    }
    #Header .menu-list *{
        color: #fff;
    }
    #Header .nav-top{
        padding: 20px 0 35px;
        margin: 0;
        
    }
    #phone_color{
        position: absolute;
        top: 74px;
        background-color: #4066b8;
        border-radius: 50%;
        bottom: -12px;
        height: 24px;
        left: 0;
        width: 100%;
    }
    .index-navbar_top {
        display: none;
    }
    #Header #top-nav{
        margin-bottom: 29px;
        background-color: #4066b8 !important;
    }
    #content-nav{
        flex-wrap: wrap;
        height: unset;
        padding: 10px 0;
        width: 100%;
    }
    #content-nav .content-nav-item{
        font-size: 12px;
        height: 20px;
        line-height: 20px;
    }
    #content-nav a {
        font-size: 12px;
        height: 20px;
        line-height: 20px;
    }
    #Header .menu-list .menu-title{
        display: none;
        position: relative;
    }
    #Header .d-flex {
        margin: auto;
        /* display: none !important; */
        position: absolute;
        z-index: 200;
        left: 0;
        right: 0;
        width: 351px;
        background-color: #fff;
        padding-left: 20px;
        top: 74px;
        color: #999;
    }
    #Header .shopping {
        display: none ;
    }
    #Header .user{
        margin-left: 0;
    }
    .d-flex .btn-outline-success{
        margin: 0 10px 0 0;
        box-shadow: none;
    }
    #Header .user button{
        margin: 0;
        padding: 0;
        height: fit-content;
        background-color: initial;
        color: #fff;
    }
    #Header .user button a {
        color: #fff;
    }
    #Header .user i{
        display: none;
    }
    .navbar-toggler i {
        font-size: 30px;
        line-height: 30px;
        color: #fff;
    }
    #Header .menu-list .navbar-nav{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: flex-start;
        margin: 0 !important;
        border-bottom: 1px solid #d4d4d4;
        padding: 16px 0;
    }
    #Header .menu-user {
        padding: 0;
    }
    #Header .menu-user .more i{
        color: #666;
        font-size: 13px;
    }
    #Header .menu-user li>a{
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 10px 0;
        font-size: 13px;
    }
    #Header .menu-list .menu-user li>a>div{
        display: flex;
        align-items: center;
    }
    #Header .menu-list .menu-user li>a>div span{
        color: #666;
    }
    #Header .menu-user li>a>div:first-child i{
        font-size: 21px;
        color: #4066b8;
        margin: 0 6px 0 0;
    }
    #Header .menu-list .navbar-nav li {
        width: calc((80vw - 32px) / 4);
        height: calc((80vw - 32px) / 4);
        font-size: 12px;
        padding: 4px;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    #Header .menu-list .navbar-nav li .nav-link{
        padding: 0;
        margin: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    #Header .menu-list .navbar-nav li.display_none{
        display: none;
    }
    #Header .menu-list .navbar-nav li.phone_absolute {
        position: absolute;
        right: 16px;
        top: 0;
        height: 60px;
        padding: 0;
        text-align: right;
        /* text-align: bottom; */
        display: flex;
        align-items: center;
    }
    #Header .menu-list .navbar-nav li .nav-list-icon img{
        /* font-size: 28px; */
        width: 30px;
        height: 30px;
        margin-bottom: 6px;
        display: block;
    }
    #Header .menu-list .navbar-nav li .nav-list-icon i{

    }
    #Header .menu-list .navbar-nav li.phone_absolute a{
        color: #fff;
        font-size: 16px;
        text-decoration: none;
        text-align: right;
        display: inline-block;

        width: 100%;
    }
    /* index */
    .index-msg {
        display: none;

    }
    .index-content  {
        padding: 10px;
        overflow: hidden;
    }
    .index-content >.discount .card-list >.card-item:nth-child(2n)  {
        margin: 0 0 5px 10px;
    }
    .index-content >.discount .card-list >.card-item {
        width: calc((100% - 10px) / 2);
    }
    .index-content >.index-hot >.content .left {
        display: none;
    } 
    .product-swiper .right {
        width: 100%;
    }
    #index .product-swiper .swiper-slide .card {
        width: 50%;
        height: 50%;
    }
    #index .swiper-button-next,
    #index .swiper-button-prev,
    #index .swiper-pagination{
        display: none;
    }
    .index-maker .content {
        display: flex;
        flex-wrap: wrap;
    }
    #index .index-maker .card a img{
        width: 90%;
        height: 90%;
        object-fit: contain;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
    }
    .index-maker .content .card{
        width: calc(100% / 3);
        height: 120px;
    }
    .index-suggest .content {
        display: flex;
        flex-wrap: wrap;
    }
    .index-suggest .card {
        width: calc(50%);
        height: calc(384px / 2);
    }
    #index .maker-img {
        height: 60px;
    }
    #index .index-blogs >.content>.card{
        width: 100%;
        margin: 0 0 20px;
    }
    #index .index-blogs >.content>.card:last-child {
        margin-bottom: 0;
    }
    #index .index-news >.content >.card {
        width: 100%;
        height: 120px;
    }
    #index .index-news >.content >.card> a {
        padding: 10px;
    }
    #index .index-news >.content >.card> a .image{
        width: 100px;
    }
    #Footer .footer-msg {
        display: none;

    }
    #Footer .footer-content>.footer-box .footer-utils_list,
    #Footer .footer-content>.footer-box .footer-nav_list{
        flex-direction: column;
    }
    #Footer .footer-content>.footer-box .footer-utils_list .footer-utils_item ,
    #Footer .footer-content>.footer-box .footer-nav_list .footer-nav_item {
        margin: 0 0 20px;
        padding: 0 10px;
        width: 100%;
    }
    
    #nav-fixed {
        display: none;
    }
    section {
        min-height: unset;
    }
    .part_number {
        padding: 20px 10px;
    }
    .part_number>.switch-list {
        justify-content: space-around;
    }
    .part_number>.switch-list>.switch-item {
        margin: 0;  
    }
    .index-content >.discount>div {
        width: 100%;
        margin-right: 0;
        
        
    }
    .index-content .discount{
        flex-wrap: wrap;
        margin-bottom: 0;
    }
    .latest-parts>li,
    .popular-parts>li{
        width: 50%;    
    }
    .comparison-parts>li{
        width: 100%;
    }
}