Examples
<div class="e-accordion">
<input type="radio" name="accordion-radio" id="accordion-radio-0" checked>
<label class="e-accordion__title" for="accordion-radio-0">
Accordion 1
</label>
<div class="e-accordion__content">
1Lorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<input type="radio" name="accordion-radio" id="accordion-radio-1">
<label class="e-accordion__title" for="accordion-radio-1">
Accordion 2
</label>
<div class="e-accordion__content">
2Lorem ipsum dolor sit amet, consetetur sadipscing elitr Loreor sit amet, consetetur sadipscing elitr Loreor sit amet, consetetur sadipscing elitr Lorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<input type="radio" name="accordion-radio" id="accordion-radio-2" disabled>
<label class="e-accordion__title" for="accordion-radio-2">
Disabled
</label>
<div class="e-accordion__content">
3Lorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<input type="radio" name="accordion-radio" id="accordion-radio-3">
<label class="e-accordion__title" for="accordion-radio-3">
Accordion 4
</label>
<div class="e-accordion__content">
4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
</div><div class="e-accordion">
<input type="checkbox" name="accordion-checkbox" id="accordion-checkbox-0" checked>
<label class="e-accordion__title" for="accordion-checkbox-0">
Accordion 1
</label>
<div class="e-accordion__content">
1Lorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<input type="checkbox" name="accordion-checkbox" id="accordion-checkbox-1">
<label class="e-accordion__title" for="accordion-checkbox-1">
Accordion 2
</label>
<div class="e-accordion__content">
2Lorem ipsum dolor sit amet, consetetur sadipscing elitr Loreor sit amet, consetetur sadipscing elitr Loreor sit amet, consetetur sadipscing elitr Lorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<input type="checkbox" name="accordion-checkbox" id="accordion-checkbox-2" disabled>
<label class="e-accordion__title" for="accordion-checkbox-2">
Disabled
</label>
<div class="e-accordion__content">
3Lorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<input type="checkbox" name="accordion-checkbox" id="accordion-checkbox-3">
<label class="e-accordion__title" for="accordion-checkbox-3">
Accordion 4
</label>
<div class="e-accordion__content">
4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr4Lorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
</div>.e-accordion-stretch
<div class="e-accordion e-accordion-stretch">
<input type="checkbox" name="accordion-stretch" id="accordion-stretch-0" checked>
<label class="e-accordion__title" for="accordion-stretch-0">
Opened Accordion
</label>
<div class="e-accordion__content">
Opened accordion sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<input name="accordion-stretch" id="accordion-stretch-1" disabled>
<label class="e-accordion__title" for="accordion-stretch-1">
Disabled Accordion
</label>
<div class="e-accordion__content">
Disabled content
</div>
<input name="accordion-stretch" id="accordion-stretch-2">
<label class="e-accordion__title" for="accordion-stretch-2">
Closed Accordion
</label>
<div class="e-accordion__content">
Closed accordion content
</div>
</div>.e-accordiontitle-active, .e-accordiontitle-disabled .e-accordion__content-active
<div class="e-accordion">
<div class="e-accordion__title e-accordion__title-active">
Opened Accordion
</div>
<div class="e-accordion__content e-accordion__content-active">
Opened accordion sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitrLorem ipsum dolor sit amet, consetetur sadipscing elitr
</div>
<div class="e-accordion__title e-accordion__title-disabled">
Disabled Accordion
</div>
<div class="e-accordion__content">
Disabled content
</div>
<div class="e-accordion__title">
Closed Accordion
</div>
<div class="e-accordion__content">
Closed accordion content
</div>
</div>