.history-slider-container {
max-width: 1200px;
margin: auto;
padding: 30px 15px;
font-family: sans-serif;
}
.timeline-nav {
text-align: center;
margin-bottom: 20px;
font-weight: 500;
}
.timeline-nav span {
margin: 0 15px;
cursor: pointer;
font-size: 16px;
color: #777;
position: relative;
}
.timeline-nav span.active {
color: #000;
font-weight: bold;
}
.timeline-nav span.active::after {
content: “”;
display: block;
width: 60%;
margin: 5px auto 0;
height: 2px;
background: #000;
}
.swiper {
width: 100%;
}
.swiper-slide {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
}
.history-text {
flex: 1 1 30%;
min-width: 280px;
padding: 10px;
}
.history-image {
flex: 1 1 35%;
min-width: 300px;
text-align: center;
}
.history-image img {
max-width: 100%;
border-radius: 10px;
}
h3.year {
font-size: 24px;
margin-bottom: 10px;
}
h4.title {
font-size: 18px;
margin-bottom: 8px;
}
p.desc {
font-size: 14px;
color: #555;
}
@media(max-width: 768px){
.swiper-slide {
flex-direction: column;
text-align: center;
}
}
.swiper-slide {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: nowrap; /* Không cho xuống dòng */
}
.history-text, .history-image {
flex: 0 0 48%; /* Mỗi bên chiếm gần nửa chiều ngang */
min-width: 300px;
}
.history-image img {
width: 100%;
height: auto;
max-width: 100%;
object-fit: cover;
}
.timeline {
display: flex;
justify-content: center;
margin-bottom: 20px;
}
.slide-container {
display: flex;
justify-content: center;
}
.content-wrapper {
max-width: 1200px;
margin: 0 auto;
display: flex;
align-items: flex-start;
gap: 40px;
}
.timeline {
padding-left: 0; /* hoặc 20px nếu toàn bộ container lệch */
}
.slide-container {
padding-left: 0;
}
.main-container {
display: grid;
grid-template-rows: auto 1fr;
justify-items: center;
}
2012
2013 — 2017
2018
2020
2024
2012
Sự khởi đầu của chúng tôi
Bocelli được thành lập tại Ý. Dựa vào sức mạnh sản xuất, hợp tác với đội ngũ thiết kế nổi tiếng của Châu Âu, chúng tôi bắt đầu phân phối sản phẩm của mình đến Châu Âu và các thị trường bọc cao cấp khác.
2013 — 2017
Sự phát triển của chúng tôi
Nhờ vào sự sáng tạo, chuyên môn và kỹ năng của các nhà thiết kế và thợ thủ công của chúng tôi, sản phẩm được xuất khẩu tới hơn 50 quốc gia và khu vực, như Châu Âu và Châu Mỹ, và hơn 1000 điểm phân phối trên toàn thế giới.
2018
Oversea Achievement
Entered markets like Germany, Spain, USA with strong brand presence.
2020
Smart Furniture Launch
Launched intelligent reclining systems and smart-home compatible furniture.
2024
Sustainable Vision
Focusing on eco-friendly materials and circular economy model.
const swiper = new Swiper(‘.swiper’, {
loop: true,
autoplay: {
delay: 4000,
disableOnInteraction: false,
},
on: {
slideChange: function () {
const timelineItems = document.querySelectorAll(“.timeline-nav span”);
timelineItems.forEach(el => el.classList.remove(“active”));
timelineItems[swiper.realIndex % timelineItems.length].classList.add(“active”);
}
}
});
document.querySelectorAll(“.timeline-nav span”).forEach((el, index) => {
el.addEventListener(“click”, () => {
swiper.slideToLoop(index);
});
});
