/*-------------------------------------layout edit----------------------------*/
main{
	max-width: 1500px;
	margin: 20px auto;
	overflow: hidden;
}
section { padding: 20px 20px; position: relative; width: 100%; overflow: hidden; z-index: 1;
 background-color: #fff;
  box-shadow:0 0px 0px 1px rgb(120 166 249 / 50%);
  	border-radius: 20px;
  	margin-bottom:20px ;

}
.shop-category-box {position: relative; display: block; overflow: hidden; /*border: #969696 1px solid;*/}
.shop-category-box img { width: 100%; height: 100%;}
.shop-category-box .shop-category-box-title { background-color: #ccc;
 position: absolute; 
 text-align: center; width: 100%; 
 left:0; bottom:0; height: 80px; 
 display:flex; justify-content:center; align-items:center; 
}
.shop-category-box-title h6 { font-size: 15px; font-weight: 600; margin-bottom: 0; line-height: 1.5;}
.shop-category-box .cat-pic {}
#page-content{
	max-width: 1500px;
	margin: 30px auto;
	padding: 20px ;


}

/*.----------------CUSTOM CỘT----------------------*/
.header_top{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.header_top #logo{
  display: flex;
  align-items: center;
  width: 22%;
}
.header_top .search_top{
  width: 50%;
  position: relative;
}
.search_top_mobile{
  display: none;
}
.search_mobile{
  display: grid;
  grid-template-columns: 7fr 3fr;
  grid-column-gap: 10px;
}
.search_top_mobile .box-stroke{
  background: #fff !important;
}
.search_mobile input, select{
  background: transparent !important;
}
.top-cornner{ display:flex;
  gap: 30px;
  width: 22%;
 }
 #mainMenu nav{
  display: grid;
  /*grid-template-columns: 50% auto auto;*/
  grid-template-columns: auto auto auto;

  justify-content: space-between;
  grid-column-gap: 20px;
 }
#mainMenu nav ul{
  display: inline-flex;
  column-gap: 15px;
  align-items: center;
}
#menu_down{
	position: relative;
  transition: 0.5s;
}

.mega_log button{
 /*color: red;
 border: 1px solid red;
 border-radius: 30px;
 */
 min-width: 140px;
}
.mn-allcats {padding: 5px 20px }

#mainMenu nav > ul li ul{
	min-width: 200px;
	position: absolute;
	left: 0;
	top: 100%;
	background: #fff;
	box-shadow:0 1px 5px 2px rgb(114 114 114 / 50%) ;
	border-radius: 10px;
	transition: .7s ease ;
	display: none;
	padding: 7px 10px;
	z-index: 9;
}
.menu_allcats {min-width: 250px !important;}

#mainMenu nav > ul li ul li{padding: 3px 0;}

#mainMenu nav > ul li ul li p {padding: 3px 0;}


#menu_down:hover ul{
	display: block;
}
.mega_menu li{
	display: block;
	padding: 4px 10px;
}

.mega_log button:hover{color: #000}
.mega-menu-content{
  display: flex;
  flex-wrap: wrap;
  gap: 5%;
}
.mega-menu-content p{
  width: 45%;
}

.main-content{
  display: grid;
  grid-template-columns:2fr 6fr 2fr ;
  column-gap: 20px;
}
.flex-layout{
  display: inline-flex;
  flex-wrap: wrap;
  gap: auto;
  justify-content: space-between;
  align-items: center;
}
.flex-layout .grid-item {
  width: 15%;
}
.grid_layout_home{
  display: grid;
  grid-template-columns: 2fr 8fr;
  justify-content: center;
  grid-column-gap: 20px;
}

.grid_layout_home .shop{
  display: inline-flex;
  gap: 1%;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
}
.grid_layout_home .shop .shop_item{
  width: 19%;
}
.grid_layout_home .shop-category-box{
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 10px;
}
.box_news{
display: grid;
grid-template-columns: 50% auto;
gap: 30px;

}
.title_news {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 70px;
}
.box_news .post-thumbnails{
  display: flex;
  flex-direction: column;
}
.box_news .post-thumbnails .post-item{
  width: 100%;
}

/* ---------------------------CUSTOM CỘT - end---------------*/
.container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl{
	max-width: 1500px;
	margin: 0 auto;

}
.top-cornner {
    display: flex;
    justify-content: center;
    align-items: center;
}
.top-left{
	transition: 1s ease  ;
}

.p-dropdown-content{
		min-width: 250px;
	position: absolute;
	left: 0;
	top: 100%;
	background: #fff;
	/*box-shadow:0 1px 5px 2px rgb(114 114 114 / 50%) ;*/
	border: #C0C0C0 1px solid;
	border-radius: 10px;
	display: none;
	opacity: 0;
	transition: .7s ease ;
	padding: 10px 15px;
}

@media (hover: hover) {
   .top-left:hover > .p-dropdown-content{
	opacity: 1;
	display: block;
} 
}


.top-left {
    position: relative;
    width: 50%;
}
#topbar {
    border-bottom: 1px solid #eee;
    background-color: #fff;
    padding: 0px 0;
    box-shadow: 2px 1px 10px #bbbbbb;
}
.top-left .top_left_icon .signin {
   color: #000;
}


.box-stroke {
    border: 2px solid #e64545;
    border-radius: 30px 30px 30px 30px;
    margin: 15px 0 15px;
    padding: 0px 0px 0px 8px;

}
.box-stroke ul{
    display: inline-flex;
    justify-content: space-between;
    align-items: center; 
    width: 100%;
    min-height: 36px;
}
.box-stroke ul li{
	display: block;
}
.box-stroke ul li:nth-child(1){width: 16%;}
.box-stroke ul li:nth-child(2){width: 70%;}
.box-stroke ul li:nth-child(3){width: 14%;}
/*  Footer */
/* ----------------------------------------------------------------
    FOOTER
-----------------------------------------------------------------*/
#footer { display: block; position: relative; background-color: #e1dfdf;  line-height: 32px; font-weight: 400; font-family: inherit; color: #000; padding:30px 0 0 0  }

#footer a:not(.btn):not(:hover) { color: #000}
#footer p { font-family: inherit; color:#eee }
 #footer .widget h4 {color: #000} 


#footer a:not(.btn) { font-weight: 400; }

#footer .footer-content { padding: 40px 0 50px 0; }

#footer .widget .widget-title, #footer .widget h4 {  letter-spacing: 1px; font-weight: 600; /* ul { li { a { font-family: $headings-font-family; line-height: 32px; color: #999; } } } */ }

#footer .widget ul { padding-left: 0; }

#footer .copyright-content { min-height: 40px; padding: 10px 0; background-color: #7693a7;  }

#footer .logo { margin-bottom: 54px; margin-top: 12px; max-width: 80px; }

#footer .footer-logo { border-right: 1px solid #333; margin-bottom: 20px; margin-right: 18px; padding-right: 16px; }

.dark #footer, #footer.inverted, #footer.dark { background-color: #181818; }

.dark #footer p, #footer.inverted p, #footer.dark p { color: #999; }

.dark #footer a:not(.btn), #footer.inverted a:not(.btn), #footer.dark a:not(.btn) { font-weight: 400; }

.dark #footer a:not(.btn):not(:hover), #footer.inverted a:not(.btn):not(:hover), #footer.dark a:not(.btn):not(:hover) { color: #999; }

.dark #footer h1, .dark #footer h2, .dark #footer h3, .dark #footer h4, .dark #footer h5, .dark #footer h6, #footer.inverted h1, #footer.inverted h2, #footer.inverted h3, #footer.inverted h4, #footer.inverted h5, #footer.inverted h6, #footer.dark h1, #footer.dark h2, #footer.dark h3, #footer.dark h4, #footer.dark h5, #footer.dark h6 { color: #fff; }

.dark #footer .widget .widget-title, .dark #footer .widget h4, #footer.inverted .widget .widget-title, #footer.inverted .widget h4, #footer.dark .widget .widget-title, #footer.dark .widget h4 { color: #fff; }

.dark #footer .copyright-content, #footer.inverted .copyright-content, #footer.dark .copyright-content { background-color: #1E1E1E; }


@media (max-width: 1200px) {
	.prothumb .image {height: 170px;}
	.paranoma .image {height: 100px;}

	.fullpic-box {height: 400px;}
	.fullpic-box img, .fullpic-box video, .fullpic-box iframe {max-height: 382px !important;}
	.fullpic-box iframe {height: 382px !important;}
}

@media (max-width: 1024px) {
	.grid-6-columns .grid-item, .post-6-columns .post-item, .portfolio-6-columns .portfolio-item {width:25%}
	
	.prothumb .image {height: 160px;}
	.paranoma .image {height: 200px;}

	.mobile-order-first {
	    -webkit-box-ordinal-group: 0 !important;
	    -webkit-order: -1 !important;
	    -ms-flex-order: -1 !important;
	    order: -1 !important;
	}
	
    #page-content {
        padding: 20px 0;
    }
}

@media (max-width: 1000px) {
	.post-thumbnails .post-item{ width:50% }
	.prothumb .image {height: 190px;}
	.prothumb2 .image {height: 170px;}
}

@media (max-width: 767px) {
	.news-list {grid-template-columns: 100%;}
	.news-list2 {grid-template-columns: 100%;}
	
	.fullpic-box {height: 350px;}
	.fullpic-box img, .fullpic-box video, .fullpic-box iframe {max-height: 332px !important;}
	.fullpic-box iframe {height: 332px !important;}

	.search_top{display: none;}
	.search_top_mobile{
		display: block;
		width: 80%;
		position: relative;
	}
	#mainMenu nav {
	    background: #182b3857;
	    border-radius: 20px;
	    padding: 15px;
	}
	#mainMenu nav > ul > li.list-icon-arrow >a:before{
		display: none;
	}
	.prothumb .image {height: 140px;}
	.prothumb2 .image {height: 120px;}
	.paranoma .image {height: 130px;}
	#header{
		height: auto;
	}
	#topbar{padding: 0}
	#header #logo img{
		width: 150px;
	}
	#header .header-inner #logo, #header #header-wrap #logo {
		height: auto;
	}
	#header #logo{
		width: 30%;
	}
	.header_top{
		justify-content: space-between;
	}
	 #mainMenu nav{
	 	grid-template-columns: 100% ;
	 }
	 #mainMenu nav ul{
	 	flex-direction: column;
	 	justify-content: flex-start;
	 }
	 #mainMenu nav ul{
	 	align-items: flex-start;
	 }
	 .menu_mobile{
	 	width:100%;
	 	display: inline-flex;
	 	flex-wrap: wrap;
	 	justify-content: right;
	 	align-items: center;
	 	column-gap:10px ;
	 }

	.mega-menu-content p{
	  width: 90%;
	}

	.main-content{
		  grid-template-columns:auto ;
		 row-gap: 30px;
	}
	.main-content .col_1{
		  
		  display: none;
	}
	.main-content .col_3{
		  
		  display: none;
	}
	.flex-layout .grid-item{
		width: 30%;
	}
	.grid_layout_home{
		 grid-template-columns:auto ;
		 row-gap: 30px;
	}

	.grid_layout_home .shop .shop_item{
	  width: 30%;
	}
	.shop-category-box{
		max-height: 300px;

	}
	.box_news{
	grid-template-columns:auto;
	gap: 30px;

	}
}

@media (max-width: 820px) {

}


@media (max-width: 576px) {
	.fullpic-box {height: 300px;}
	.fullpic-box img, .fullpic-box video, .fullpic-box iframe {max-height: 282px !important;}
	.fullpic-box iframe {height: 282px !important;}

    .prothumb h2 {font-size: 16px; line-height: 1.6;}
    .prothumb .image {height: auto; overflow: auto;}
    .prothumb2 {padding-bottom: 10px;}
    .prothumb2 h2 {font-size: 16px; line-height: 1.6; padding-bottom: 5px;}
    .prothumb2 .image {height: auto; overflow: auto;}
    .paranoma .image {height: auto; overflow: auto;}
    #header .header-inner, #header #header-wrap{
    	padding: 7px 0;
    }
    .top-cornner{
    	width: 60%;
    	z-index: 9;
    }
  @media (hover: none) {
  		.top-left:active  > .p-dropdown-content{
			opacity: 1;
			display: none;
		} 
  }
}

@media (max-width: 468px) {
	.supplier-info {text-align: center;}
	.inquiry-cart2 {display: block; padding: 15px 0 0 0 !important; text-align: center;}

}