You have 03 items in your shopping bag
<div class="accordion-1" id="accordion">
<div class="panel">
<div class="accordion-title">
<a class="collapse" href="#accor-content-1">
Accordion title here
</a>
</div>
<div id="accor-content-1" class="panel-collapse collapse show"> data-parent="#accordion"
<div class="accor-content">
There are many variations of passages of Lorem Ipsum available.
</div>
</div>
</div>
<div class="panel">
<div class="accordion-title">
<a class="collapse"href="#accor-content-2">
Accordion title here
</a>
</div>
<div id="accor-content-2" class="panel-collapse collapse"> data-parent="#accordion"
<div class="accor-content">
There are many variations of passages of Lorem Ipsum available.
</div>
</div>
</div>
<div class="panel">
<div class="accordion-title">
<a class="collapse"href="#accor-content-3">
Accordion title here
</a>
</div>
<div id="accor-content-3" class="panel-collapse collapse"> data-parent="#accordion"
<div class="accor-content">
There are many variations of passages of Lorem Ipsum available.
</div>
</div>
</div>
</div>
.accordion-1 .panel {
border: none;
border-radius: 0;
box-shadow: none;
}
.accordion-title a {
background: #C8A165 none repeat scroll 0 0;
color: #fff;
display: block;
font-size: 16px;
padding: 10px 60px 10px 20px;
position: relative;
}
.accordion-title a.collapsed {
background: #f6f6f6 none repeat scroll 0 0;
color: #666;
}
.accordion-title a::before {
color: #fff;
content: "\f2f8";
font-family: material-design-iconic-font;
font-size: 25px;
position: absolute;
right: 30px;
text-align: center;
}
.accordion-title a.collapsed:before {
content: "\f2f2";
color: #ccc;
}
.accor-content {
padding: 15px 20px;
border: 1px solid #F6F6F6;
border-top: 0;
}
<div class="accordion-2" id="accordion2">
<div class="panel">
<div class="accordion-title">
<a data-bs-toggle="collapse" href="#accor-content-20">
Accordion title ...
</a>
</div>
<div id="accor-content-20" class="panel-collapse collapse show" data-bs-parent="#accordion2">
<div class="accor-content">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered If you are going to use a passage Lorem Ipsum, you alteration in some form.
</div>
</div>
</div>
<div class="panel">
<div class="accordion-title">
<a class="collapsed" data-bs-toggle="collapse" href="#accor-content-21">
Accordion title ...
</a>
</div>
<div id="accor-content-21" class="panel-collapse collapse" data-bs-parent="#accordion2">
<div class="accor-content">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered If you are going to use a passage Lorem Ipsum, you alteration in some form.
</div>
</div>
</div>
<div class="panel">
<div class="accordion-title">
<a class="collapsed" data-bs-toggle="collapse" href="#accor-content-22">
Accordion title ...
</a>
</div>
<div id="accor-content-22" class="panel-collapse collapse" data-bs-parent="#accordion2">
<div class="accor-content">
There are many variations of passages of Lorem Ipsum available, but the majority have suffered If you are going to use a passage Lorem Ipsum, you alteration in some form.
</div>
</div>
</div>
</div>
.accordion-1 .panel {
border: none;
border-radius: 0;
box-shadow: none;
}
.accordion-title a {
background: #C8A165 none repeat scroll 0 0;
color: #fff;
display: block;
font-size: 16px;
padding: 10px 60px 10px 20px;
position: relative;
}
.accordion-title a.collapsed {
background: #f6f6f6 none repeat scroll 0 0;
color: #666;
}
.accordion-title a::before {
color: #fff;
content: "\f2f8";
font-family: material-design-iconic-font;
font-size: 25px;
position: absolute;
right: 30px;
text-align: center;
}
.accordion-title a.collapsed:before {
content: "\f2f2";
color: #ccc;
}
.accor-content {
padding: 15px 20px;
border: 1px solid #F6F6F6;
border-top: 0;
}