Sale!
Cà Phê nguyên chất ROBUSTA – Bì 250g (Hạt)
149.000 ₫
99.000 ₫
Sale!
Cà Phê nguyên chất ROBUSTA – Bì 500g (Hạt)
279.000 ₫
239.000 ₫
Sale!
Cà Phê nguyên chất ARABICA – Bì 500g (Hạt)
299.000 ₫
269.000 ₫
Sale!
Cà Phê nguyên chất ARABICA – Bì 250g (Hạt)
150.000 ₫
129.000 ₫
Sale!
Cà Phê bột ARABICA – Bì 500g
--
149.000 ₫
Sale!
Cà Phê bột ARABICA – Bì 250g
--
109.000 ₫
Sale!
Cà Phê bột ROBUSTA – Bì 250g
--
95.000 ₫
Sale!
Cà Phê bột ROBUSTA – Bì 500g
--
139.000 ₫
/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-36ac942 *//* General Styles for News Section */
.news-section {
padding: 20px;
background-color: #fff;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
margin: 20px;
border-radius: 8px;
}
.news-title {
font-size: 2em;
font-weight: bold;
color: #3E2723;
margin-bottom: 20px;
text-align: center;
}
.news-grid {
display: flex;
flex-wrap: nowrap;
overflow-x: auto; /* Thêm thanh cuộn ngang */
gap: 20px;
padding-bottom: 10px; /* Khoảng cách dưới cùng để tạo hiệu ứng khi cuộn */
scroll-behavior: smooth; /* Hiệu ứng cuộn mượt mà */
}
.news-item {
background-color: #fff;
padding: 20px;
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
flex: 0 0 auto; /* Cố định chiều rộng của mỗi item */
transition: transform 0.3s ease-in-out;
width: 300px; /* Thiết lập chiều rộng cố định cho mỗi item */
}
.news-item:hover {
transform: translateY(-10px);
}
.news-item img {
width: 100%;
height: auto;
border-radius: 8px;
object-fit: cover;
}
.news-item h3 {
margin-top: 15px;
font-size: 1.4em;
color: #3E2723;
}
.news-item p {
font-size: 1em;
margin-top: 10px;
line-height: 1.5;
}
.news-item a {
display: inline-block;
margin-top: 15px;
padding: 10px 20px;
background-color: #3E2723;
color: white;
text-decoration: none;
border-radius: 5px;
}
.news-item a:hover {
background-color: #5D4037;
}
/* Style for 'See More' Button */
.see-more-btn {
display: inline-block;
padding: 10px 20px;
background-color: #3E2723;
color: white;
text-decoration: none;
border-radius: 5px;
text-align: center;
width: 100%;
margin-top: 20px;
}
.see-more-btn:hover {
background-color: #5D4037;
}
/* Responsive Design */
@media (max-width: 1024px) {
.news-grid {
flex-wrap: nowrap;
justify-content: flex-start; /* Canh lề trái cho các item */
}
}
@media (max-width: 768px) {
.news-item {
width: 250px; /* Điều chỉnh chiều rộng cho tablet */
}
}
@media (max-width: 480px) {
.news-item {
width: 200px; /* Điều chỉnh chiều rộng cho mobile */
}
.news-title {
font-size: 1.6em;
}
.news-item h3 {
font-size: 1.2em;
}
}/* End custom CSS */