[class*= "col-"]{
float: left;
padding: 15px;
min-height: 20px;
width: 100%;
}

@media only screen and (max-width: 768px){ /*mobile*/
	body{
	width: 100%;	
	}
	#slideshow {
    width: 100%;
    }
	#top-right, #top-left{
	width: 50%;
	}
	#hotline{
	display: block;
	}
	.product {
	min-height: 330px;
	position: relative;
	padding-bottom: 0;
	}

	.btnAdd {
	position: relative;
	left: auto;
	bottom: auto;
	transform: none;
	width: 80%;
	margin-top: 10px;
	}
	.col-t-1{width: 8.33%;}
	.col-t-2{width: 16.66%;}
	.col-t-3{width: 25%;}
	.col-t-4{width: 33.33%;}
	.col-t-5{width: 41.66%;}
	.col-t-6{width: 50%;}
	.col-t-7{width: 58.33%;}
	.col-t-8{width: 66.66%;}
	.col-t-9{width: 75%;}
	.col-t-10{width: 83.33%;}
	.col-t-11{width: 91.66%;}
	.col-t-12{width: 100%;}
}
@media only screen and (min-width: 768px){ /*tablet*/
	#menu{
	display: block;
	}
	.footer-info{
	display: block;
	}
	#slideshow {
    width: 100%;
    }	
	#b-deliver{ 
	float: right;
	}
	#b-logo{
	width:40%; 
	}
	.product {
	min-height: 315px;
	position: relative;
	padding-bottom: 0;
	}

	.btnAdd {
	position: absolute;
	bottom: 15px;
	left: auto;
	transform: translateX(-50%);
	}
	.col-s-1{width: 8.33%;}
	.col-s-2{width: 16.66%;}
	.col-s-3{width: 25%;}
	.col-s-4{width: 33.33%;}
	.col-s-5{width: 41.66%;}
	.col-s-6{width: 50%;}
	.col-s-7{width: 58.33%;}
	.col-s-8{width: 66.66%;}
	.col-s-9{width: 75%;}
	.col-s-10{width: 83.33%;}
	.col-s-11{width: 91.66%;}
	.col-s-12{width: 100%;}
}
@media only screen and (min-width: 1024px){ /*laptop+PC*/
	#b-policy{
	display: block;
	}
	#b-support{
	display: block;
	}
	#b-time{
	display: block;
	}
	#top-left{
	display: block;
	}
	#sidebar{
	display: block;
	}
	#slideshow {
    width: 72%;
    }
	#b-logo{
	width:20%; 
	}
	.col-m-1{width: 8.33%;}
	.col-m-2{width: 16.66%;}
	.col-m-3{width: 25%;}
	.col-m-4{width: 33.33%;}
	.col-m-5{width: 41.66%;}
	.col-m-6{width: 50%;}
	.col-m-7{width: 58.33%;}
	.col-m-8{width: 66.66%;}
	.col-m-9{width: 75%;}
	.col-m-10{width: 83.33%;}
	.col-m-11{width: 91.66%;}
	.col-m-12{width: 100%;}
}
@media only screen and (min-width: 1280px){ /*TV+big screen devices*/
	.col-x-1{width: 8.33%;}
	.col-x-2{width: 16.66%;}
	.col-x-3{width: 25%;}
	.col-x-4{width: 33.33%;}
	.col-x-5{width: 41.66%;}
	.col-x-6{width: 50%;}
	.col-x-7{width: 58.33%;}
	.col-x-8{width: 66.66%;}
	.col-x-9{width: 75%;}
	.col-x-10{width: 83.33%;}
	.col-x-11{width: 91.66%;}
	.col-x-12{width: 100%;}
}

/* ===== MENU MOBILE ===== */
#mobile-menu-btn {
    display: none;
}

/* menu khi thu nhỏ */
@media (max-width: 1024px) {
    #mobile-menu-btn {
        display: block;
    }

    #menu ul {
        display: none;
        flex-direction: column;
        background: #003366;
        width: 100%;
        padding: 10px;
    }

    #menu ul.show {
        display: flex;
    }

    #menu ul li {
        float: none !important;
        width: 100%;
        padding: 10px 0;
    }

    #login {
        display: none;
    }

    #login.show {
        display: block;
        text-align: center;
        background: #002244;
        padding: 10px;
    }
}

