﻿/*********************************
5. Home
*********************************/
h1
{
	padding-left:35px;
}
h2
{
	font-size: 1.3em;
	color: var(--color3);
	background: linear-gradient(to right, var(--color2),var(--color1)); 
	padding:6px;
	border-radius: 10px;
	box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* tạo bóng đổ */
	text-align:justify;
}
.products .icon
{
	font-size: 1.4em;
	color: #FFFFFF;
	position:absolute;
	margin-left:10px;
	margin-top:14px;
}
.motachitiet
{
	
}
.home
{
	width: 100%;
	height:441px;
}
.home_container
{
	position: absolute;
	left: 0;
	bottom: 173px;
	width: 100%;
}
.home_title
{
	font-size: 30px;
	font-weight: 600;
	color: #FFFFFF;
	line-height: 0.75;
}
.breadcrumbs ul
{
	line-height: 0.75;
}
.breadcrumbs ul li
{
	display: inline-block;
	position: relative;
	font-size: 12px;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 0.75;
}
.breadcrumbs ul li:not(:last-child)::after
{
	display: inline-block;
	content: '/';
	margin-left: 3px;
	margin-right: 3px;
}
.breadcrumbs ul li a
{
	font-size: 12px;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 0.75;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.breadcrumbs ul li a:hover
{
	color: #2cd983;
}

/*********************************
7. products
*********************************/

.products
{
	width: 100%;
	background: #ede5d4;
	padding-top: 30px;
	padding-bottom: 30px;
}

.products_post:not(:last-child)
{
	/* padding-bottom: 49px; */
}
.products_post_date_container
{
	width: 70px;
	height: 90px;
	border-radius: 39px;
	background: linear-gradient(to right, #006600, #03ad03);
}

.products_post_day
{
	font-size: 36px;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 0.75;
}
.products_post_month
{
	font-size: 14px;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 0.75;
	margin-top: 11px;
}
.products_post_title
{
	
}
.products_post_title a
{
	font-size: 15px;
	font-weight: 600;
	color: #FFFFFF;
	line-height: 1.2;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.products_post_title a:hover
{
	color: #FFFF00;
}
.products_post_info
{
	margin-top: 3px;
}
.products_post_icon
{
	margin-top:-20px;	
}

.anhsanpham
{
	width:100%;
	box-shadow: 5px 10px 15px -10px #000;
    -webkit-box-shadow: 5px 10px 15px -10px #000;
    background-color: rgb(255, 255, 255);
    border-color: rgb(144, 190, 174);
    border-width: 5px;
    border-radius: 10px;
    padding:2px;
    margin-bottom:15px;
	}



.products_post_info ul li
{
	display: inline-block;
	position: relative;
	font-size: 14px;
	font-weight: 500;
	color: #838383;
}
.products_post_info ul li:not(:last-child)::after
{
	display: inline-block;
	position: relative;
	content: '|';
	font-size: 14px;
	font-weight: 500;
	color: #838383;
	margin-left: 10px;
	margin-right: 6px;
}
.products_post_info ul li a
{
	font-size: 14px;
	font-weight: 500;
	color: #838383;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-ms-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.products_post_info ul li a:hover
{
	color: #2cd983;
}
.products_post_image
{
	margin-top: 6px;
	width: 100%;
	padding:8px;
}
.products_post_image img
{
	
	max-width: 100%; /* height:550px; */
}
@media (max-width: 768px) {
 .products_post{
    font-size:0.7em;
    width:200px !important ;
  }
 }
   @media (max-width: 412px) {
 .products_post{
    font-size:0.7em;
    width:203px !important ;
  }
 }
 @media (max-width: 360px) {
 .products_post{
    font-size:0.7em;
    width:175px !important ;
  }
 }

 
.products_post_text
{
	margin-top: 12px;
}
.pagination
{
	margin-top: 42px;
}
.pagination ul li
{
	display: inline-block;
}
.pagination ul li a
{
	font-size: 16px;
	font-weight: 600;
	color: #252525;
}
.pagination ul li a:hover,
.pagination ul li.active a
{
	color: #3f6fce;
}
.pagination ul li .active
{color: #3f6fce;}

.xemtiepsanpham
{
	color: #FFFFFF;
	margin:0 auto;
	font-family: fontFB;
	font-size:1.1em;
}
.xemtiepsanpham:hover
{
	font-weight: bold;
	color: #FFFF00;
}
@media only screen and (max-width: 560px)
{
	.xemtiepsanpham
	{
		font-size:1em;
	}
}