/* ADD-ON
-------------------------------------------------- */
.swal2-title
{
	font-size: 14px;
	font-weight: normal;
}

.header
{
background-color: #263C97;
border-bottom: 1px solid #f1f1f1;
}


/* TOP HEADER
-------------------------------------------------- */
.location_ward 
{
background-color: #fff;
color: #333;	
}

.top_header
{
    border-bottom: 1px solid #e5e5e5;
    border-color: rgba(255, 255, 255, 0.1);
}

.top_header > .container > .wrap
{
height: 50px;
color: #fff;
}

.top_header > .container > .wrap  a
{
	color: #fff;
}



.top_header .wrap .left
{
display: flex;
align-items: center;
}

.top_header .wrap .left .selection_block
{
display: flex;
align-items: center;	
border-right: 1px solid rgba(255, 255, 255, 0.1);
padding: 0 10px;
}


.top_header .wrap .left .selection_block:nth-child(1)
{
	padding-left:0;	
}

.top_header .wrap .left .selection_block:nth-child(3)
{
	border-right:0;
}


.top_header .wrap .right ul
{
	list-style: none;
	display: flex;
}

.top_header .wrap .right ul li
{
	padding: 0 15px;
	border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.top_header .wrap .right ul li:last-child
{
	border-right:0;
	padding-right:0;
}

.top_header .menu li
{

}


.top_header .menu li a
{
	color: #333;
	padding: 5px 0;
}

.location_ward
{
	padding: 10px;
	box-shadow: none;
}

/* SECOND HEADER
-------------------------------------------------- */
.second_header
{
    border-bottom: 1px solid #e5e5e5;
    border-color: rgba(255, 255, 255, 0.1);
}

.second_header > .container > .wrap
{
	height: 100px;
	color: #fff;
}

.second_header > .container > .wrap > .left
{
width: 20%;
}

.second_header .left .logo img
{
	width: 200px;
}

.second_header > .container > .wrap >.center
{
width: 40%;
position: relative;
}

.second_header > .container > .wrap > .right
{
width: 40%;
}

.search_box
{	
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 5px;
	background-color: #fff;
}

.search_field, .search_button
{
	display: block;
	float: left;
}

.search_box .search_field input
{
	display: none;
}


.search_suggest_keyword_desktop
{
padding: 10px 10px;	

}

.search_suggest_keyword b 
{
	color: #333;
	font-weight: normal;
}

.search_suggest_keyword_desktop
{
	
}

.search_box input, .search_box button
{
	border:0;
	padding: 10px;
}

.search_field input
{
	display: block;
	float: left;
	width: 100%;
	background-color: transparent;
	border: 0;
	height: 100%;
	outline: none;
}

.search_box button
{
 background-color: var(--yellow1);
 font-size: 15px;
}

/**** Search Result ********/
.search_listing
{
display: none;
float: left;
width: 100%;
z-index: 10;
position: absolute;
background-color: #fff;
padding: 10px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px 0px;
}

.search_listing.show
{
display: block;	
}

.search_suggest
{
display: block;
float: left;
width: 100%;

}

.search_suggest > .title
{
display: block;
float: left;
width: 100%;
color: #666;
margin-bottom: 5px;
text-transform: uppercase;
}

.search_suggest > .link
{
display: block;
float: left;
width: 100%;
margin-bottom: 5px;
}


.search_suggest > .link > a 
{
	display: inline-block;
	padding: 6px 5px;
	background-color: #ededed;
	border-radius: 5px;
	margin-right: 10px;
	margin-bottom: 10px;
	font-size: 12px;
}

.search_result
{
display: block;
float: left;
width: 100%;
color: #666;
}

.search_item
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content:flex-end;	
	width: 100%;
	padding: 10px 0;
	border-top: 1px solid #ccc;
}


.search_item > .left_item
{
	width: 30%;
}

.search_item > .right_item
{
	width: 70%;
	font-size: 13px;
}

.search_item > .left_item > .photo
{
display: block;
float: left;
width: 100%;
text-align: center;	
}

.search_item > .left_item > .photo > img
{
	width: 80px;
}

.search_item > .right_item > .product_name
{
	font-size: 15px;
	color: var(--blue1);
}

.search_item > .right_item > .product_name_vn
{
	display: block;
	float: left;
	width: 100%;
	line-height: 20px;	
}

.search_item > .right_item > .product_spec
{
	display: block;
	float: left;
	width: 100%;
	line-height: 20px;
}

/**********************/

.second_header .right 
{
	align-content: center;
	justify-content:flex-end;
}

.second_header .right  .link_button
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content:space-between;
	margin-right: 30px;
	align-items: center;
	cursor: pointer;
	color: #fff;
}

.second_header .right  .link_button .icon
{
	position: relative;
	font-size: 28px;
}

.second_header .right  .link_button .text1
{
	color: #ccc;
	line-height: 20px;
	
}

.second_header .right  .link_button:last-child
{
	margin-right: 0;
}

.second_header .right  .link_button .upper_badge
{
display: inline-block;
position: absolute;
font-size: 12px;
background-color: var(--yellow1);
right:0;
top:-5px;
padding: 0 5px;
border-radius: 5px;
color: #333;
}	



/* MENU PHAN LOAI
-------------------------------------------------- */

.phanloai_link
{
	display: block;
	float: left;
	width: 100%;
	background-color: var(--yellow1);
	padding: 14px;
	text-transform: uppercase;
	text-align: center;
}


.menu_phanloai_wrap
{
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content: space-between;
width: 500px;
padding: 20px 15px;
border-radius: 0;
background-color: #fff;
}

.menu_phanloai_wrap >  div
{
	display: block;
	float: left;
	width: 48%;
	margin: 0;
}

.menu_phanloai_wrap  a
{
border-radius: 5px;
border: 1px solid #ccc;
color: #333;
padding: 10px;
margin-bottom: 15px
}

.menu_phanloai_wrap  a:hover
{
border: 1px solid yellow;
}

.menu_phanloai_wrap .icon
{
	display: block;
	float: left;
}

.menu_phanloai_wrap .icon img
{
	height: 32px;
}

.menu_phanloai_wrap .text
{
	display: block;
	float: left;
	width: 75%;
}

.menu_phanloai_wrap .text1
{
	font-size: 12px;
	text-transform: uppercase;
	padding-bottom: 5px;
}


.menu_phanloai_wrap .text2
{
	font-size: 12px;
	color: #959595;
}
/* THIRD HEADER
-------------------------------------------------- */

.third_header > .container > .wrap
{
    color: #fff;
}

.third_header .left .menu  li:hover
{
	background: none;
}

.third_header .navbar-menu
{
	width: 60%;
}


.third_header .right
{
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content: flex-end;

}

.third_header .support_button
{
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content: space-between;	
align-items: center;
}

.third_header .support_button a 
{
	color: #fff;
}

.third_header .support_button .icon
{
	font-size: 20px;
	
}

.navbar-menu ul
{
display: block;
float: left;
width: 100%;
margin: 0;
}

.navbar-menu li
{
display: inline-block;
}

.navbar-menu li a
{
display: block;
color: #fff;
font-size: 14px;
padding: 14px 15px;
text-transform: uppercase;
}


.navbar-menu .dropdown-content a
{
	color: #333;
}


/* Dropdown button */
.dropbtn {
  border: none;
  outline: none;
  background-color: inherit;
  font-family: inherit; /* Important for vertical align on mobile phones */
  margin: 0; /* Important for vertical align on mobile phones */
}

.navbar-menu .dropdown:hover .dropbtn {
    background: #007bff;
	color: #fff;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #fff;
  min-width: 160px;
  max-width: 250px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 2;
}

.dropdown-content ul li
{
display: block;
float: left;
width: 100%;
}

.navbar-menu .dropdown-content a:hover {
  background-color: #ddd;
}



.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown-content a:hover {background-color: #f1f1f1;}

.dropdown:hover .dropdown-content {
  display: block;
}




/* HOMEPAGE BANNER
-------------------------------------------------- */
.top_banner
{
	display: block;
	float: left;
	width: 100%;
}


.top_banner img
{
	width: 100%;
	height: auto;
}



.category-banner
{
width: 100%;
display: block;
float: left;
overflow: hidden;
}

.category-banner ul li
{
display: block;
float: left;
width: 100%;
overflow: hidden;
height: 300px;
background-size: cover;
}

/* Caption text */
.caption-text {
width: 100%;
color: #f2f2f2;
font-size: 15px;
bottom: 8px;
text-align: center;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);
}

.caption-text h1
{
margin-bottom: 10px;
}


.caption-text
{
padding-top: 80px;
}

.homepage-canxi
{
display: block;
float: left;
width: 100%;
margin-top:20px;
}

/* HOMEPAGE BRAND
-------------------------------------------------- */


.brand_listing
{
background-color: #fff;
padding: 15px 15px;
padding-bottom:0;
}



.homepage-brand-item
{
	display: block;
	width: 100%;
	float: left;
	background-color: #fff !important;
	text-align: center;
	padding: 10px 0;
	border: 1px solid var(--gray1);
	border-radius: 5px;
	margin-bottom: 15px;
}

.homepage-brand-item:hover
{
	border: 1px solid #0a6cc7;
}


.homepage-brand-item .brand_logo  img
{
	width: 70px;
}

.brand_logo, .brand_name
{
display: block;
float: left;
width: 100%;
}

.brand_country
{
display: block;
float: left;
width: 100%;
font-size: 11px;
color: #c8c8c8;
margin-top:3px;
}

.brand_country b
{
	font-weight: 100;
}


.brand_country .ah-words-wrapper
{
	text-align:center;
	font-size: 12px;
}

.brand_rating
{
display: block;
float: left;
width: 100%;

}

.brand_min_price
{
display: block;
float: left;
width: 100%;
font-size: 11px;
color: #c8c8c8;
margin-top:3px;
}

.brand_min_price > span
{
display: inline;
background-color: #2196F3;
color: #fff;
font-size: 11px;
padding: 0 3px;
}



.brand_tag_ribbon {
	display:block;
	position: absolute;
	z-index:5;
}

.brand_tag_ribbon > .bottom {
    display: block;
	position: absolute;
    height: 0px;
    bottom: -25px;
    border-bottom: 10px solid transparent;
    left: -5px;
    border-right: 5px solid rgb(28 167 97);
}

.brand_tag_ribbon > .text
{
	display: block;
	position: absolute;
	bottom: -15px;
	width: 90px;
	background: rgb(43, 217, 130);
	font-size: 12px;
	left: -5px;
	color: #fff;
	padding: 3px 0;
}


.brand_tag_ribbon2 {
    display: block;
    position: relative;
    line-height: 12px;
    font-size: 12px;
    -webkit-font-smoothing: antialiased;
    font-weight: 700;
    top: -80px;
    padding: 2px 12px;
    clear: both;
    background: rgb(43, 217, 130);
    left: -10px;
}

.brand_tag_ribbon2 > .bottom {
    display: block;
    height: 0px;
    position: absolute;
    bottom: -10px;
    border-bottom: 10px solid transparent;
    z-index: 1;
    left: 0px;
    border-right: 5px solid rgb(28 167 97);
}

.brand_tag_ribbon2 > .text
{
	color: #fff;
	text-transform: uppercase;
}


/* HERO CARD
-------------------------------------------------- */
.section_hero .wrap .item
{
display: flex;
width: 100%;
flex-wrap: wrap;
align-content: center;
justify-content:space-between;
color: #fff;
height: 200px;
border-radius: 5px
}


.section_hero .wrap .item .image img
{
	width: 180px;
}

.section_hero .wrap .item .text
{
	font-size: 16px;
	margin-left: 15px;
	margin-top: 30px;
}

.section_hero .wrap .item .text .text1
{
font-size: 15px;
text-transform: uppercase;
font-weight: bold;
line-height: 30px;
text-shadow: 2px 2px 2px #008BCE;
}

.section_hero .wrap .item .text .text2
{
display: inline-block;
font-size: 14px;
color: #333;
background-color: yellow;
padding: 5px;
border-radius: 5px;
}

.section_hero .wrap .item .text a
{
display: block;
float: left;
background-color: var(--yellow1);
color: #333;
padding: 8px;
margin-top: 20px;
}

.hero_item1
{
	background: url(/images/homepage/hero/horeca.webp);
	background-size: cover;
	background-position:center center
}


.hero_item2
{
	background: url(/images/homepage/hero/a2.webp);
	background-size: cover;
	background-position:center center
}


/* .hero_item3 */
/* { */
	/* background-color: #3e61ab; */
/* } */

#background_cycler{padding:0;margin:0;width:100%;height:100%;position:absolute;top:0;left:0;z-index:-1;}
#background_cycler div{position:absolute;left:0;top:0;width:100%;height:100%;z-index:1;background-color:white;background-size:cover;background-position:center center; border-radius: 5px}
#background_cycler div.active{z-index:3}

/* HOTSALES
-------------------------------------------------- */
.hotsales_wrap
{
background-color: #fff8ca;
padding: 10px 0;
}


.hotsales_wrap > .box_top
{
	margin-bottom: 0;
	padding: 10px 15px;
	padding-bottom: 0;
	margin-bottom: 5px;
}

.hotsales_wrap > .box_top > .title
{
display: block;
float: left;
font-size: 15px;
text-transform: uppercase;
color: #333;

}

.hotsales_wrap > .box_top > .countdown_block
{
display: block;
}

.hotsales_wrap .coundown_time_block
{
display: block;
float: left;
margin-left: 10px;	
color: #333;
font-size: 14px;

}

.hotsales_wrap .remaing_block
{
display: block;
float: left;
background-color: #333;
color: #fff;
padding: 0 10px;
margin-right: 5px
}

.section_hotsales
{
	margin-bottom: 20px;
}
.section_hotsales .product_listing
{
display: block;
float: left;
width: 100%;
padding: 0 10px;
}

.section_hotsales .item_wrap
{
display: block;
float: left;
width: 100%;
height: 100%;
background-color: #fff;
}

.hot_item
{
display: block;
float: left;

padding: 15px 10px;
}


.hot-label {
overflow: hidden;
display: block;
top: 200px;
width: 150px;
z-index: 2;
padding: 0 5px;
height: 18px;
font-size: 12px;
color: #fff;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);
}

.lable_discount {
display: block;
float: left;
position: fixed;
color: #fff;
background-image: linear-gradient(-90deg,#ec1f1f 0%,#ff9c00 100%);
font-size: 13px;
padding: 3px;
z-index: 2;
}



/* HOMEPAGE  CATEGORY
--------------------------------------------------*/
.homepage-category
{
border-bottom: 1px solid var(--gray1);
}

.homepage-category .left
{
	border-bottom: 4px solid var(--yellow1);
	padding-bottom: 15px;
	font-size: 15px;
	text-transform: uppercase;
	margin-bottom: -2px;
	font-weight: bold;
}

.homepage-category .right a
{
display: inline-block;
padding: 0 10px;
}

.homepage-category .right a:hover
{
	font-weight: bold;
}

.homepage-category .right a:last-child
{
padding-right:0;	
}


.homepage-category .right .active
{
	font-weight: bold;
	color: #4b91ff;
}

.category_wrap .product_listing
{
display: block;
width: 100%;
margin-top:25px;
}


.category_wrap .item_wrap
{
	display: block;
	float: left;
	position: relative;
	width: 100%;
	height: 100%;
	background-color: #fff;
}



/* PRODUCT DETAIL LISTING
--------------------------------------------------*/
.item-list {
display: block;
float: left;
position: relative;
padding: 15px;
background-color: #fff;
border-radius: 5px;

}

.product_href
{
	display: block;
	float: left;
	width: 100%;	
}

.product-desc
{
	display: block;
	float: left;
	width: 100%;
}

.brand_info
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content:space-between;
	align-items: end;
	margin-bottom: 5px;
	position: relative;
}

.brand_info .name
{
	color: blue;
	z-index: 1;
}

.brand_info .country
{
	display: block;
	position: absolute;
	left: 0;
	top: -25px;
	background-color: #fff400;
	color: #333;
	font-size: 10px;
	padding: 5px;
	border-radius: 5px;
	min-width: 40px;
	text-align: center;
	text-transform: uppercase;
}



.brand_info .country img
{
	width: 24px;
}

.product_name
{
	display: block;
	float: left;
	width: 100%;
	margin-bottom: 5px;
}

.product_name_vn
{
	display: block;
	float: left;
	width: 100%;
	font-size: 12px;
	color: #838383;
}


.photobox  img
{
height: 200px;
}


.photobox
{
display:block;
float: left;
width: 100%;	
text-align: center;
}

.product-stock-status
{
	display: block;
	width: 100%;
	position: absolute;
	background-color: rgb(227 227 227 / 50%);
	z-index: 3;
	text-align: center;
	top: 100px;
	padding: 20px 0;
}

.product-review-status
{
display: block;
float: left;
width: 100%;
margin-bottom: 10px;
}

.rating-status
{
display: inline-block;
width: 49px;
height: 8px;
font-size: 0;
line-height: 0;
background: url(/images/element/rating_01.png);
background-size: cover;
overflow: hidden;
}

.current_rating {
float: left;
height: 8px;
background: url(/images/element/rating_02.png);
background-size: cover;
}

.review-status
{
display: inline-block;
color: #333;
}

.product_sub_desc
{
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content:space-between;
width: 100%;

}

.product_sub_desc .item
{
	width: 49%;
	background-color: #f0f0f0;
	text-align: center;
	padding: 5px 0;
	line-height: 16px;
	font-size: 12px;
}

.product_sub_desc .item .title
{
	color: #818181;
	font-size: 11px;
}

.product_old_price
{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	align-content: center;
	justify-content:flex-start;
	margin-top:10px;
	height: 20px;
}

.product_old_price > div
{
	margin-right: 5px;
	
}

.product_old_price .item-old-price
{
color: #898686;
text-decoration: line-through;
}


.discount_percent
{
	color: red;
}

.product_current_price
{
display: block;
float: left;
width: 100%;
position: relative;
font-size: 16px;	
color: red;
padding: 5px 0;
}

.add_favourite
{
display: block;
position: absolute;
right: 0;
top: 0;
color: #999;
z-index: 1;
}

.add_favourite.active
{
	color: red;

}


.label-saving
{
background-color: #ffe31a;
color: red;
width: 50px;
text-align:center;
cursor: pointer;
}


.feature_text1
{
display: block;
border: 1px solid #13abff;
border-radius: 5px;
font-size: 11px;
padding: 3px 5px;
color: #007bff;

}


.product_current_unit_price
{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	align-content: center;
	justify-content:flex-start;
	color: red;
	font-size: 14px;
}


.product-unit-price { background-color: #2196F3; color: #fff; padding: 0 5px;   text-transform: lowercase;}

.hot_features
{
	display: block;
	float: left;
	width: 50px;
	position: absolute;
	right: 5px;
	top: 5px;
}

.hot_features > ul 
{
	display: block;
	list-style-type: none;
}

.hot_features > ul  > li 
{
	display: block;
	float: left;
	width: 100%;
	text-align: center;
	margin-bottom: 10px;
	padding: 5px 2px;
	border-radius: 5px;
	font-size: 11px;
	border: 1px solid #ccc;
	background-color: #fff; 
	color: #333;
}



.available_size
{
position: absolute;
width: 35px;
overflow: hidden;
font-size: 11px;
top: 5px;
}

.available_size > ul
{
	display: block;
	float: left;
	list-style-type:none;
}


.available_size > ul > li
{
	display: block;
	float: left;
	width: 100%;
	border: 1px solid #ccc;
	text-align: center;
	font-size: 10px;
	margin-bottom: 10px;
	padding: 1px 0;
}

.available_size > ul > li:last-child
{
	margin:0;
}
.available_size > ul > li .thumb, .available_size > ul > li .size_text
{
	display: block;
	float: left;
	width: 100%;
	font-size: 10px;
}

.available_size > ul > li .thumb
{
	margin-bottom: 5px;
	margin-top: 5px;
}

.available_size > ul > li .thumb > img
{
	width: 24px;
}

/* HOMEPAGE  GENERAL MILK
--------------------------------------------------*/
.section_general_milk
{
	background-color: #fff;
}


.section_general_milk .wrap
{
	margin-top: 20px;
	margin-bottom: 20px;
}


.section_general_milk .wrap .section_milk_by_cat
{
	width: 30%;
}


/*ITEM TYPE 1
-------------------------------------------------- */

.item_type1
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content: space-evenly;
	padding: 15px 0;
	--tw-bg-opacity: 1;
	background-color: rgb(248 250 252/var(--tw-bg-opacity));
	margin-top: 15px;
	margin-bottom: 15px;
	border-radius: 5px;
	position: relative;
}

.item_type1 .left
{
	width: 40%;

}

.item_type1 .right
{
	width: 55%;
}

.item_type1 .left .image
{
	width: 100%;
	text-align: center;


} 

.item_type1 .left .image img
{
	width: 100%;
}


/* HERO BANNER MEADOW & PROMESS
-------------------------------------------------- */
.section_canxi .wrap .card
{
	width: 49%;
}

.section_canxi .wrap .card img
{
width: 100%;
}




/*  HOMEPAGE NEWS LISTING
-------------------------------------------------- */
.section_news
{
	padding-top:20px;
}

.section_news .wrap
{
margin-top: 20px;
}

.section_news .item
{
	display: inline-block;
	width: 100%;
	border-radius: 20px;

}

.section_news .item .image
{
    overflow: hidden;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
	
}

.section_news .item .image img
{
	width: 100%;
	height: 150px;
}


.news_content_wrap
{
	display: block;
	width: 100%;
	padding: 20px;
	background-color: #fff;
}

.news_content_wrap .title
{
	display: block;
	width: 100%;
	margin-bottom: 5px;	
	height: 40px;
}
.news_content_wrap .title a
{
	font-weight: bold;
	line-height: 20px;
}


.news_content_wrap .category
{
	display: block;
	width: 100%;
	margin-bottom: 5px;	
	font-size: 11px;
	text-transform: uppercase;
	color: #999;
}

.news_content_wrap .category .category_name
{
	color: blue;
}

.news_content_wrap .short_desc
{
display: block;
width: 100%;
padding: 10px 0;
margin-bottom: 10px;
color: #333;
}

.news_content_wrap .more
{
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content:space-between;
height: 40px;
border-top: 1px solid var(--gray1);
}

.news_content_wrap .more .posted_time
{
	color: #999;
}


/*  FOOTER
-------------------------------------------------- */

.footer
{
	display: block;
	float: left;
	width: 100%;
	background-color: #313c46;
	margin-top:30px;
}

/***** First *****/
.first_footer_wrap
{
display: block;
float: left;
width: 100%;
background-color: #2d3741;

}

.first_footer
{
display: flex;
width: 100%;
flex-wrap: wrap;
align-content: center;
justify-content:space-between;	
padding: 30px 0;


}

.first_footer > .item
{
	width: 20%;
	display: flex;
}


.first_footer > .item > .icon
{
	
	font-size: 42px;
	color: var(--yellow1);
}


.first_footer > .item > .text > .text1
{
	font-size: 12px;
	color: #fff;
	text-transform: uppercase;
	line-height: 30px;
	font-weight: bold
}

.first_footer > .item > .text > .text2
{
	font-size: 11px;
	color: #999;
}

/***** Second *****/
.second_footer_wrap
{
display: block;
float: left;
width: 100%;
background-color: #313c46;
border-bottom: 1px solid #FFFFFF1A;
}

.second_footer
{
display: flex;
width: 100%;
flex-wrap: wrap;
align-content: center;
justify-content:space-between;	
padding: 40px 0;

}

.second_footer .item
{
width: 30%;
}

.second_footer .item2, .second_footer .item3,  .second_footer .item4,  .second_footer .item5
{
width: 15%;
}
	
.second_footer .item .title
{
	display: block;
	float: left;
	width: 100%;
	font-size: 18px;
	color: #fff;
	text-transform: capitalize;
	font-weight: bold;
	margin-bottom: 20px;
}

.second_footer .item  ul
{
	display: block;
	float: left;
	width: 100%;
	list-style-type: none;
}

.second_footer .item  ul li
{
	display: block;
	float: left;
	width: 100%;
	padding: 7px 0;
	color: #999;
}

.second_footer .item  ul li a
{

	color: #999;
}

.opening_hour
{
	display: block;
	float: left;
	padding: 10px;
	margin-top: 20px;
	color: #999;
	border: 1px solid #ccc;
	border-radius: 5px;
}

.call_wrap
{
	display: block;
	float: left;
	width: 100%;
}

.call_supporter 
{
display: flex;
width: 100%;
flex-wrap: wrap;	
align-items: center;
}

.call_supporter  .icon
{
	font-size: 28px;
	color: var(--yellow1);
}

.call_supporter .text
{
	font-size: 20px;
	text-transform: uppercase;
	text-align: center;
	color: #999;
}

.call_number
{
	font-size: 30px;
	color: #fff;
}

.toll_free
{
	font-size: 12px;
	color: #fff;	
	letter-spacing: 2px;
}


.social_wrap
{
	display: block;
	float: left;
	width: 100%;	
	margin-top: 20px;
}

.social_list
{
display: flex;
width: 100%;
flex-wrap: wrap;	
align-items: center;
}

.social_list a
{
	display: flex;
	flex-wrap: wrap;	
	align-items: center;
	justify-content: center;
	align-content: center;
	color: #fff;
	font-size: 20px;
	margin-right: 10px;
	border-radius: 5px;
	width: 35px;
	height: 35px;

}

.social_list a:hover
{
background-color: yellow;
color: #333;	
}

.social_list .facebook {
    background-color: #3b5998;
}

.social_list .zalo {
    background-color: #1da1f2;
}

.social_list .website {
    background-color: #f26522;
}


.verified_stamp_wrap
{
	display: block;
	float: left;
	width: 100%;
	margin-top: 10px;
}


.verified_stamp
{
	display: flex;
	flex-wrap: wrap;	
	align-items: center;
	justify-content: center;
}

.verified_stamp > .item
{
	display: flex;
	flex-wrap: wrap;	
	margin-right: 10px;
	width: 170px;
	border: 2px solid #555555;
	align-items: center;
	height: 50px;
}

.verified_stamp > .item:last-child
{
	margin:0;
}
.verified_stamp .item .logo
{
	display: block;
	float: left;
	padding: 5px;
	border-right: 1px solid #4c4c4c;
}

.verified_stamp .item .logo img
{
	width: 32px;
}

.verified_stamp .item .text
{
	display: block;
	float: left;	
	margin-left: 5px;
}

.verified_stamp .item .text .text1
{
	font-size: 11px;
	color: #999;
}

.verified_stamp .item .text .text2
{
	text-transform: uppercase;
	color: #fff;
	font-size: 11px;
	font-weight: bold;
	line-height: 20px;
}

/***** Third *****/
.third_footer
{
	display: block;
	float: left;
	width: 100%;
	padding: 15px 0;	
}

.third_footer .payment
{
	display: block;
	float: left;
	width: 100%;
	text-align: center;
}

.third_footer .payment .text
{
	font-size: 11px;
	margin-bottom: 10px;
	color: #999
}

.third_footer .payment img
{
	height: 32px;
}

.third_footer .company_info
{
	display: block;
	float: left;
	width: 100%;
	text-align: center;
	color: #999;
	font-size: 11px;
	margin-top:10px;
	text-transform: uppercase;
}

.third_footer .company_info .name
{
	color: #fff;
}

	
/********** progress bar **********/
.progress {
	display: block;
	float: left;
	width: 100%;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}

.progress-bar {
  text-align: left;
  line-height: 20px;
  padding-left: 10px;
}


.progress-bar-success {
  background-color: #5cb85c;
}

.progress-bar-success {
  background-image: -webkit-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0.15) 75%,
    transparent 75%,
    transparent
  );
  background-image: -o-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0.15) 75%,
    transparent 75%,
    transparent
  );
  background-image: linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.15) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.15) 50%,
    rgba(255, 255, 255, 0.15) 75%,
    transparent 75%,
    transparent
  );
}

/********** GENERAL BANNER **********/

.section_general_banner
{
	display: block;
	float: left;
	width: 100%;
}


.general_banner
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	flex-direction: column;
    justify-content: center;
	height: 300px;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.8);
	color: #fff;
}


.general_banner > h1
{
	display: block;
	float: left;
	width: 100%;
	font-size: 30px;
	text-align: center;
	text-transform: capitalize;
	margin-bottom: 10px;
}

.general_banner > h2
{
	display: block;
	float: left;
	width: 100%;
	font-size: 20px;
	text-align: center;
	text-transform: capitalize;
}

.general_banner_mobile > img
{
	width: 100%;
	height: auto;
}

/*  MODAL
-------------------------------------------------- */

.blocker {
position: fixed;
top: 0; right: 0; bottom: 0; left: 0;
width: 100%; height: 100%;
overflow: auto;
z-index: 999;
box-sizing: border-box;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.4);
text-align: center;
backdrop-filter: blur(3px);
}
.blocker:before{
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.05em;
}
.blocker.behind {
  background-color: transparent;
}
.modal {
  display: none;
  vertical-align: middle;
  position: relative;
  z-index: 1000;
  max-width: 1100px;
  box-sizing: border-box;
  text-align: left;
  
}

.modal a.close-modal {
position: absolute;
top: 0;
right: 0;
display: block;
padding: 5px;
color: #818181;
font-size: 1.2em;
text-align: center;
}

.modal a.close-modal:hover
{
background-color: #ccc;
color: #fafafa;
}


.modal_download_document {
display: block;
width: 500px;
background-color: #fff;
padding: 20px;
}

.modal_cart {
display: block;
width: 500px;
background-color: #fff;
padding: 20px;
}

/***** SECTION INTRO *******/

.section_intro
{
display: block;
float: left;
width: 100%;
}

.section_intro .wrap_intro
{
display: block;
float: left;
width: 100%;	
background-color: #fff;	
}

.section_intro .heading h1
{
	font-size: 20px;
	margin-top:20px;
}


.section_intro .wrap
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;	
	padding: 20px 0;
	border-radius: 10px;
}

.section_intro .wrap .column
{
	width: 25%;
	padding: 5px 0px;
	border-right: 1px solid #ededed;
}

.section_intro .wrap .column:last-child
{
	border:0;
}

.section_intro .wrap .column .content
{
	display: block;
	float: left;
	width: 100%;
	position: relative;
	padding: 10px 20px;
}

.section_intro .wrap .column .content .icon
{
	display: block;
	float: left;
	width: 100%;
	color: #14278f;
	text-align: center;
}

.section_intro .wrap .column .content .icon img
{
	width: 64px;
}

.section_intro .wrap .column .content .text
{
	text-align: center;
}

.section_intro .wrap .column .content .text .text1
{
text-transform: uppercase;
line-height: 30px;	
color: #898989;
}

.section_intro .wrap .column .content .text .text2
{
	line-height: 20px;
	font-size: 13px;
}

/***** WISH LIST*******/

.popup_favourite_list:before{
    width: 0;
    content: "";
    height: 0;
    border-style: solid;
    border-width: 0 7px 8px 7px;
    border-color: transparent transparent #ffffff transparent;
    text-align: center;
    top: 0;
    left: 0;
    margin-top: -8px;
    margin-left: 10px;
    position: absolute;
}


.popup_favourite_list
{
	display: block;
	float: left;
	width: 400px;
	background-color: #fff;
	margin-top: 10px;
	padding: 5px;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px 0px;
}

.favourite_list_wrap
{
	display: block;
	float: left;
	width: 100%;	
	max-height: 470px;
	overflow-y: auto;
	scrollbar-width: thin;
}


.favourite_product
{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	align-content: center;		
	justify-content: space-between;	
	border-bottom: 1px solid #efefef;
	padding: 5px 0;
}

.favourite_product:last-child
{
	border:0
}

.favourite_product > .left
{
	width: 30%;
}

.favourite_product > .left > .photo
{
	display: block;
	float: left;
	width: 100%;
	text-align: center;
}

.favourite_product > .left > .photo > img
{
	width: 80px;
}

.favourite_product > .right
{
	width: 70%;
	padding-right: 10px;
	position: relative;
}

.favourite_product > .right .product-review-status
{
	margin-bottom: 5px;	
}

.favourite_product > .right > .remove_favourite
{
	display: block;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 5;
	background-color: #fff;
	border: 0;
	color: #666;
}

.empty_favourite
{
	display: block;
	float: left;
	width: 100%;
	text-align: center;
	padding: 20px 0;
}

.empty_favourite > .icon
{
	display: block;
	float: left;
	width: 100%;
	font-size: 100px;	
}

.empty_favourite > .icon > img 
{
	width: 150px;
}

.empty_favourite > .text
{
	display: block;
	float: left;
	width: 100%;
	color: #666;	
}

/***** CART *******/

.section_cart_add
{
	display: block;
	float: left;
	width: 100%;
	
}

.cart_header
{
	display: block;
	float: left;
	width: 100%;
	border-bottom: 1px solid #ccc;	
	padding-bottom: 10px;
	font-size: 15px;
}

.cart_header > .product_name
{
	display: block;
	float: left;
	width: 100%;
	font-size: 14px;	
}

.cart_header > .product_name_vn
{
	display: block;
	float: left;
	width: 100%;
	font-size: 12px;	
}

.cart_body
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content:space-between;
	width: 100%;
	padding-top: 20px;
	margin-top: 20px;
}

.cart_body > .left
{
	width: 30%;
}

.cart_body > .right
{
	width: 70%;
	padding-left: 20px;
}

.cart_body > .left > .photo
{
	display: block;
	float: left;
	width: 100%;	
	padding: 5px;
	border: 1px solid #efefef;
	border-radius: 10px;
}

.cart_body > .left > .photo > img 
{
	width: 100%;
}

.phanloai_text 
{
	display: block;
	float: left;
	width: 100%;
	margin-bottom: 10px;
}

.hop_thung, 
.hop_block
{
	font-size: 12px;
}

.hop_block
{
	display: none;
}

.danhsach_option, .danhsach_option_sanpham, .danhsach_option_donvi 
{
	display: block;
	float: left;
	width: 100%;	
}

.danhsach_option > .item
{
	display: inline-block;
	position: relative;
	margin-right: 10px;
}

.danhsach_option > .item:last-child
{
	margin:0
}

.danhsach_option > .item a
{
	display: block;
	float: left;
	width: 100%;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 5px;
	
}

.danhsach_option > .item a.active
{
	border: 1px solid var(--blue1);
	color: var(--blue2);
}

.cheaper_badge
{
	display: block;
	position: absolute;
	left: -5px;
	top: -8px;
	background-color: #00db00;
	font-size: 10px;
	color: #fff;
	padding: 2px 5px;

}

.cheaper_badge > .bottom
{
	display: block;
	position: absolute;
	height: 0px;
	bottom: -10px;
	border-bottom: 10px solid transparent;
	left: 0;
	border-right: 5px solid rgb(28 167 97);
}



.product_choose_quality_form
{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	align-content: center;
	justify-content:space-between;	
}

.product_choose_quality_form > .left
{
	width: 30%;
}

.product_choose_quality_form > .right 
{
	width: 70%;
}



.cart_footer
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content:space-between;
	width: 100%;
	padding-top: 20px;
	margin-top: 20px;
	border-top: 1px solid #ccc;
	align-items: center;
}

.cart_footer > .left, .cart_footer > .right
{
	display: block;
	float: left;
	width: 50%;
}

.cart_footer > .right
{
	text-align: right;
}


.cart_footer .cart_summary
{
	color: red;
}

.product_max_notice
{
	display: none;
	float: left;
	width: 100%;
	color: red;
	margin-top:10px;
	font-size: 12px;
}

.product_max_notice.show
{
	display: block;
}
/***** CART LIST*******/

.popup_cart_list:before {
    width: 0;
    content: "";
    height: 0;
    border-style: solid;
    border-width: 0 7px 8px 7px;
    border-color: transparent transparent #ffffff transparent;
    text-align: center;
    top: 0;
    right: 0;
    margin-top: -8px;
    margin-right: 15px;
    position: absolute;
}


.popup_cart_list
{
	display: block;
	float: left;
	width: 400px;
	background-color: #fff;
	margin-top: 10px;
	padding: 10px;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px 0px;
}

.cart_popup_body
{
	display: block;
	float: left;
	width: 100%;
	max-height: 500px;
	overflow-y: auto;
	scrollbar-width: thin;
	margin-bottom: 10px;
}

.popup_product_item
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	justify-content:space-between;	
	align-items: center;
	border-top: 0;
	border-bottom: 1px solid #efefef;
	margin-bottom: 10px;
	padding: 10px 0;
}

.popup_product_item:last-child
{
	border-bottom: 0;
	padding: 0;
}

.popup_product_item > .left
{
	width: 25%;
}

.popup_product_item > .right 
{
	width: 75%;
	padding: 0 10px;
	position: relative;
}

.popup_product_item > .right > .remove_product
{
	display: block;
	position: absolute;
	right: 0;
	top: 30px;
	z-index: 5;
	border: 0;
	color: #333;
	font-size: 15px;
}

.popup_product_item > .right > .product_spec
{
	display: block;
	float: left;
	width: 100%;
	padding: 3px 0;	
}


.product_change_form
{
	display: block;
	float: left;
	width: 100%;
	margin-top:10px;
}

.product_change_form > .left
{
	display: block;
	float: left;
	width: 50%;
	color: red;
}

.product_change_form > .right
{
	display: block;
	float: left;
	width: 50%;
}


.popup_product_item > .left > .photo
{
	display: block;
	float: left;
	width: 100%;
	text-align: center;
	border: 1px solid #dfdfdf;
	border-radius: 5px;
}

.popup_product_item > .left > .photo > img
{
	width: 100%;
}

.cart_popup_footer
{
	display: block;
	float: left;
	width: 100%;
	border-top: 1px solid #ccc;
	color: #333;
}

.cart_popup_footer > .summary
{
display: flex;
width: 100%;
flex-wrap: wrap;
align-content: center;
justify-content:space-between;	
padding: 5px 0;
}

.cart_popup_footer > .summary > .left, .cart_popup_footer > .summary > .right
{
	width: 50%;
}

.cart_popup_footer > .summary > .right
{
	text-align: right;
}

.cart_popup_footer > .button {
	display: block;
	float: left;
	width: 100%;	
}




.change_quality_form
{
display: flex;
flex-wrap: wrap;
align-content: center;
justify-content: flex-end;
}

.change_quality_form > input 
{
	display: inline-block;
	height: 25px;
	width: 40px;
	background-color: #fff;
	border: 1px solid #ccc;
	border-left: 0;
	border-right:0;
	text-align: center;
	outline: none;
	border-radius: 0;
}

.change_quality_form > button
{
	display: inline-block;
	height: 25px;
	padding: 0 10px;
	background-color: #fff;
	border: 1px solid #ccc;
	text-align:center;
	outline: none;
}


/***** FORM GROUP*******/
.modal_header
{
	display: block;
	float: left;
	width: 100%;
	text-align: center;	
	text-transform: capitalize;
	font-size: 15px;
	padding-bottom: 10px;
	font-weight: bold;
	color: #344054;
}

.modal_body
{
	display: block;
	float: left;
	width: 100%;
	padding: 10px 0;	
}



/*****PAYMENT*******/
.section_payment
{
display: block;
float: left;
width: 100%;
background-color: #fff;
padding: 20px;
margin-bottom: 20px;
}

.payment_item
{
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	align-content: center;
	justify-content:flex-start;	
	align-items: center;
	padding: 8px 0;
	cursor: pointer;
}


.payment_item.active
{
	background-color: #f5f5f5;
	border-radius: 5px;
}

.payment_item > .radio
{
	display: block;
	float: left;
	padding: 0 15px;
}

.payment_item > .icon
{
	display: block;
	float: left;
}

.payment_item > .icon > img 
{
	width: 24px;
	height: 24px;
}

.payment_item > .text
{
	display: block;
	float: left;
	padding-left: 10px;
}

.payment_item > .fee
{
	display: block;
	float: left;
	padding-left: 10px;
	color: red;
}



.modal_cart_pre_process
{
	width: 500px;
	padding: 20px;
	box-shadow: none;
}

.modal_cart_pre_process > .wrap
{

	text-align: center;
}

.modal_cart_pre_process > .wrap > .title
{
	color: #fff;
	margin-bottom: 20px;
}



.modal_cart_qrcode
{
width: 350px;
padding: 20px;
box-shadow: none;
background-color: #fff;	
}

.modal_cart_qrcode > .wrap
{
	text-align: center;
}

.modal_cart_qrcode > .wrap > .title
{
	font-size: 15px;
	margin-bottom:10px;
}

.qrcode_section
{
position: relative;
height: 320px;
}

.qrcode_section > .qr_image
{
width: 100%;
position: absolute;

}

.qrcode_section> .qr_image > img
{
	width: 100%;
}

.close_qrcode
{
	position: absolute;
	right: 0;
	top: 0;
	padding: 10px;
	font-size: 15px;
}


.modal_cart_result
{
width: 350px;
padding: 20px;
box-shadow: none;
background-color: #fff;	
}

.modal_cart_result > .wrap
{
	text-align: center;
}

.modal_cart_result > .wrap > .status
{
	font-size: 15px;
	text-transform: uppercase;
	color: #379b05;
	margin-bottom: 20px;
	margin-top: 10px;
}

.modal_cart_result > .wrap > .title
{
	font-size: 15px;
	text-transform: uppercase;
	font-weight: bold;
	margin-bottom: 10px;
}

.modal_cart_result > .wrap > .note
{
	color: #666;
	line-height: 20px;
	margin-bottom: 20px;
}


/*  Hoa don
-------------------------------------------------- */
.section_mau_tracuu_hoadon
{
	padding: 20px;
}

.ketqua_tracuu_hoadon
{
	display: none;
}

/* 404 NOT FOUND
-------------------------------------------------- */
.section_404
{
	padding: 50px;
}

.section_404 > .wrap
{
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}

.row-404
{
	 justify-content: center;
}

.row-404 > .icon 
{
	width: 200px;
	background-color: #fff;
	padding: 50px;
	border-radius: 50%;
	margin-right: 20px;
}
.row-404 > .icon > img 
{
	width: 100%;
}

.row-404 > .text >  h1
{
	font-size: 50px;
	margin-bottom: 10px;
}

.row-404 > .text >  h2
{
	text-transform: uppercase;
	margin-bottom: 10px;
}

.row-404 > .text >  p 
{
	padding: 10px 0;
}

/* WHITE BLOCK
-------------------------------------------------- */
.content_box {
	background-color: #fff;
	border-radius: 4px;
	padding: 15px;
	position: relative;
	line-height: 25px;
	margin-bottom: 10px;
}

.highlights3
{
	display: block;
	float: left;
	margin-top: 10px;
	margin-bottom: 10px;
	width: 100%;
}

.highlights3 li
{
	display: block;
	width: 100%;
	float: left;
	padding: 5px;
	padding-left: 0;
}

.highlights3 li::before {
    content: '\f105';
    font-family: 'ICON';
    padding: 0 3px 0 0;
}

.highlights3 a
{
	color: #2d89ea;
}


/* TRANG DOWNLOAD HO SO ATTP
-------------------------------------------------- */
.section_download_doc
{
display: block;
float: left;
width: 100%;	
}

.section_download_doc .title
{
	text-transform: uppercase;
}

.file_list
{
display: block;
float: left;
width: 100%;	
}


.file_info
{
	display: flex;
	flex-wrap: wrap;
	align-content: center;		
	justify-content: space-between;
	border-bottom: 1px solid #efefef;	
	padding: 5px 0;
}

.file_info a
{
	color: var(--blue1);
}

.file_info:last-child
{
	border: 0;
}

.section_download_doc .importer_info
{
display: block;
float: left;
width: 100%;		
text-align: center;
}

.section_download_doc .importer_info img
{
	width:20%;
}

.document_notice
{
display: block;
float: left;
width: 100%;
padding: 10px;
background-color: #e4f4ff;
line-height: 25px;	
}

.document_notice > i 
{
	color: green;
}

/* UTILITY
-------------------------------------------------- */
.text1_label
{
	display: inline-block;
	font-size: 10px;
	border: 1px solid var(--blue1);
	border-radius: 5px;
	padding: 3px;
	color: #0058ff;
	text-transform: uppercase;
	margin-top: 5px;
}	

.text1_label b 
{
	font-weight: 100;
}

.text1_label i 
{
	font-style: normal;
}

.text1_label .ah-words-wrapper
{
	text-align: center;
}

.popup_modal 
{
	padding: 30px;
	text-align: center;
	width: 600px;
}
	
.popup_modal img
{
	width: 100%;
}