@syncfusion/ej2/accordion/bootstrap4.css

A modern JavaScript UI toolkit that has been built from the ground up to be lightweight, responsive, modular and touch friendly. It is written in TypeScript and has no external dependencies.

/*! accordion icons */.e-accordion .e-tgl-collapse-icon::before{content:'\e705'}.e-accordion .e-tgl-collapse-icon.e-expand-icon{transform:rotate(-180deg)}/*! accordion layout */.e-bigger .e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content,.e-accordion.e-bigger .e-acrdn-item .e-acrdn-header .e-acrdn-header-content{font-size:16px;line-height:24px;vertical-align:middle}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel{font-size:14px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel.e-nested>.e-acrdn-content,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel.e-nested>.e-acrdn-content{padding:0}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-acrdn-content .e-accordion,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-acrdn-content .e-accordion{border:0}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-panel.e-nested .e-acrdn-content .e-acrdn-header,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-panel.e-nested .e-acrdn-content .e-acrdn-header{padding:0 30px 0 45px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-item.e-select .e-acrdn-header,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-item.e-select .e-acrdn-header{padding:0 30px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-header .e-acrdn-header-content,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-header .e-acrdn-header-content{font-size:16px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-header,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-header{line-height:48px;min-height:50px;padding:0 20px 0 20px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-header .e-toggle-icon,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-header .e-toggle-icon{height:50px;min-height:50px;min-width:24px;right:15px;font-size:14px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-header .e-acrdn-header-icon,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-header .e-acrdn-header-icon{display:inline-block;padding:0 12px 0 0}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-header .e-acrdn-header-icon .e-acrdn-icons.e-icons,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-header .e-acrdn-header-icon .e-acrdn-icons.e-icons{font-size:16px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content{padding:20px;font-size:16px;line-height:24px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-content,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-content{padding:15px 15px 15px 45px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-panel .e-acrdn-content,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-panel .e-acrdn-content{padding:15px 15px 15px 60px}.e-bigger .e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-header,.e-accordion.e-bigger .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-header{padding:0 30px}.e-bigger .e-accordion.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel.e-nested>.e-acrdn-content,.e-accordion.e-bigger.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel.e-nested>.e-acrdn-content{padding:0}.e-bigger .e-accordion.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-content,.e-accordion.e-bigger.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-content{padding:15px 45px 15px 15px}.e-bigger .e-accordion.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-panel.e-nested>.e-acrdn-content,.e-accordion.e-bigger.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-panel.e-nested>.e-acrdn-content{padding:0}.e-bigger .e-accordion.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-panel .e-acrdn-content,.e-accordion.e-bigger.e-rtl .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content .e-acrdn-panel .e-acrdn-panel .e-acrdn-content{padding:15px 60px 15px 15px}.e-bigger .e-accordion.e-rtl .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-panel.e-nested .e-acrdn-content .e-acrdn-header,.e-accordion.e-bigger.e-rtl .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-panel.e-nested .e-acrdn-content .e-acrdn-header{padding:0 45px 0 30px}.e-bigger .e-accordion.e-rtl .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-item.e-select .e-acrdn-header,.e-accordion.e-bigger.e-rtl .e-acrdn-item.e-select .e-acrdn-panel.e-nested .e-accordion .e-acrdn-item.e-select .e-acrdn-header{padding:0 30px}.e-bigger .e-accordion.e-rtl .e-acrdn-item .e-acrdn-header,.e-accordion.e-bigger.e-rtl .e-acrdn-item .e-acrdn-header{padding:0 15px 0 30px}.e-bigger .e-accordion.e-rtl .e-acrdn-item .e-acrdn-header .e-toggle-icon,.e-accordion.e-bigger.e-rtl .e-acrdn-item .e-acrdn-header .e-toggle-icon{left:15px;right:auto}.e-bigger .e-accordion.e-rtl .e-acrdn-item .e-acrdn-header .e-acrdn-header-icon,.e-accordion.e-bigger.e-rtl .e-acrdn-item .e-acrdn-header .e-acrdn-header-icon{padding:0 0 0 12px}.e-accordion{display:block;position:relative}.e-accordion .e-acrdn-item>.e-acrdn-header .e-acrdn-header-content{font-weight:normal}.e-accordion .e-acrdn-item.e-selected{padding-top:0}.e-accordion .e-acrdn-item.e-selected>.e-acrdn-header .e-acrdn-header-content{font-weight:normal}.e-accordion .e-acrdn-item.e-overlay{height:auto}.e-accordion .e-acrdn-item{overflow:hidden;padding-top:0;position:relative}.e-accordion .e-acrdn-item.e-hide{display:none}.e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content{font-size:14px}.e-accordion .e-acrdn-item.e-select>.e-acrdn-header{cursor:pointer}.e-accordion .e-acrdn-item.e-select>.e-acrdn-header:hover .e-acrdn-header-content,.e-accordion .e-acrdn-item.e-select>.e-acrdn-header:focus .e-acrdn-header-content{text-decoration:underline}.e-accordion .e-acrdn-item .e-acrdn-header{line-height:39px;min-height:40px;overflow:hidden;padding:0 16px 0 16px;text-decoration:none;text-overflow:ellipsis;white-space:nowrap}.e-accordion .e-acrdn-item .e-acrdn-header>*{display:inline-block}.e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content{line-height:1.5}.e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-icon{display:table;font-size:12px;height:40px;min-height:40px;min-width:24px;position:absolute;right:15px;top:0}.e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-icon .e-tgl-collapse-icon.e-icons{display:table-cell;text-align:center;vertical-align:middle}.e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-animation{transition:.5s ease 0s}.e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-icon{display:inline-block;padding:0 8px 0 0}.e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-icon .e-acrdn-icons.e-icons{font-size:14px}.e-accordion .e-acrdn-item .e-acrdn-panel{font-size:14px;overflow-y:hidden;text-decoration:none;width:100%}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested>.e-acrdn-content{padding:0}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested>.e-acrdn-content .e-acrdn-panel.e-nested>.e-acrdn-content{padding:0}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested>.e-acrdn-content .e-accordion{border:0}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested>.e-acrdn-content .e-accordion .e-acrdn-panel.e-nested .e-acrdn-content .e-acrdn-header{padding:0 30px 0 45px}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested .e-acrdn-item.e-select.e-selected .e-acrdn-header>.e-acrdn-header-content{font-weight:normal}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested .e-nested .e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content{font-weight:normal}.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-panel .e-acrdn-content{padding:15px 15px 15px 45px}.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-panel .e-acrdn-panel .e-acrdn-content{padding:15px 15px 15px 60px}.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content{line-height:1.5;overflow:hidden;padding:16px;text-overflow:ellipsis}.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content>*{overflow:hidden;text-overflow:ellipsis}.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content .e-acrdn-header{padding:0 30px}.e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content .e-acrdn-header-content{font-size:16px;font-size:14px}.e-accordion .e-acrdn-item .e-content-hide{display:none}.e-accordion.e-rtl .e-acrdn-item .e-acrdn-panel.e-nested>.e-acrdn-content .e-accordion .e-acrdn-panel.e-nested .e-acrdn-content .e-acrdn-header{padding:0 45px 0 30px}.e-accordion.e-rtl .e-acrdn-item .e-acrdn-panel .e-acrdn-content .e-acrdn-header{padding:0 30px}.e-accordion.e-rtl .e-acrdn-item .e-acrdn-panel .e-acrdn-panel .e-acrdn-content{padding:15px 45px 15px 15px}.e-accordion.e-rtl .e-acrdn-item .e-acrdn-panel .e-acrdn-panel .e-acrdn-panel .e-acrdn-content{padding:15px 60px 15px 15px}.e-accordion.e-rtl .e-acrdn-item .e-acrdn-header{padding:0 15px 0 30px}.e-accordion.e-rtl .e-acrdn-item .e-acrdn-header .e-toggle-icon{left:15px;right:auto}.e-accordion.e-rtl .e-acrdn-item .e-acrdn-header .e-acrdn-header-icon{padding:0 0 0 8px}/*! accordion theme */.e-accordion{-webkit-tap-highlight-color:transparent;background:#f8f9fa;border:1px solid rgba(0,0,0,0.13);border-radius:4px}.e-accordion .e-active{background:#fff}.e-accordion .e-acrdn-item{border-bottom:1px solid rgba(0,0,0,0.13);border-radius:4px 4px 0 0}.e-accordion .e-acrdn-item.e-select:last-child{border-bottom:0;border-radius:0 0 4px 4px}.e-accordion .e-acrdn-item.e-overlay.e-select.e-expand-state .e-acrdn-header .e-icons,.e-accordion .e-acrdn-item.e-overlay.e-select.e-expand-state .e-acrdn-header .e-acrdn-header-content{color:#6c757d}.e-accordion .e-acrdn-item.e-overlay{background:#f8f9fa;opacity:inherit}.e-accordion .e-acrdn-item.e-overlay .e-acrdn-header .e-icons,.e-accordion .e-acrdn-item.e-overlay .e-acrdn-header .e-acrdn-header-content{color:#6c757d}.e-accordion .e-acrdn-item.e-selected.e-select.e-expand-state>.e-acrdn-header:focus{background:#f8f9fa}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested .e-acrdn-content .e-acrdn-item:last-child{border-bottom:1px none rgba(0,0,0,0.13)}.e-accordion .e-acrdn-item .e-acrdn-panel.e-nested .e-acrdn-header .e-acrdn-header-content{color:#007bff}.e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content{color:#212529;background:#fff;border-top:1px solid rgba(0,0,0,0.13)}.e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-content{color:#007bff}.e-accordion .e-acrdn-item .e-acrdn-header .e-acrdn-header-icon{color:#007bff}.e-accordion .e-acrdn-item.e-expand-state.e-select:not(.e-selected)>.e-acrdn-header:focus{background:#f8f9fa}.e-accordion .e-acrdn-item .e-acrdn-header:hover{background:#f8f9fa}.e-accordion .e-acrdn-item .e-acrdn-header:active{background:#f8f9fa}.e-accordion .e-acrdn-item .e-acrdn-header:focus{background:#f8f9fa}.e-accordion .e-acrdn-item.e-select.e-acrdn-item>.e-acrdn-header:hover .e-icons,.e-accordion .e-acrdn-item.e-select.e-acrdn-item>.e-acrdn-header:hover .e-acrdn-header-content{color:#0056b3}.e-accordion .e-acrdn-item.e-select.e-acrdn-item>.e-acrdn-header:hover:focus .e-icons,.e-accordion .e-acrdn-item.e-select.e-acrdn-item>.e-acrdn-header:hover:focus .e-acrdn-header-content{color:#007bff}.e-accordion .e-acrdn-item.e-select.e-selected>.e-acrdn-header{background:#f8f9fa}.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header{background:#f8f9fa}.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header:hover .e-icons,.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header:hover .e-acrdn-header-content,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header:hover .e-icons,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header:hover .e-acrdn-header-content{color:#0056b3}.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header:hover:focus .e-icons,.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header:hover:focus .e-acrdn-header-content,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header:hover:focus .e-icons,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header:hover:focus .e-acrdn-header-content{color:#007bff}.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header>.e-toggle-icon,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header>.e-toggle-icon{color:#007bff}.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header .e-acrdn-header-icon,.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state>.e-acrdn-header .e-acrdn-header-content,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header .e-acrdn-header-icon,.e-accordion .e-acrdn-item.e-select.e-expand-state>.e-acrdn-header .e-acrdn-header-content{color:#007bff}.e-accordion .e-acrdn-item.e-selected.e-select{border-bottom:1px none #000;border-top:1px none #000;border-bottom:1px solid rgba(0,0,0,0.13)}.e-accordion .e-acrdn-item.e-selected.e-select.e-select:last-child{border-bottom:1px none rgba(0,0,0,0.13)}.e-accordion .e-acrdn-item.e-selected+.e-selected{border-top:1px none #000}.e-accordion .e-acrdn-item.e-selected .e-selected:last-child{border-bottom:1px none #000}.e-accordion .e-acrdn-item.e-selected.e-select>.e-acrdn-header{border-radius:4px}.e-accordion .e-acrdn-item.e-selected>.e-acrdn-panel .e-acrdn-content{color:#212529}.e-accordion .e-acrdn-item.e-selected>.e-acrdn-panel .e-acrdn-header-content{color:#007bff}.e-accordion .e-acrdn-item .e-toggle-icon{color:#007bff}.e-accordion .e-acrdn-item .e-acrdn-panel{font-size:14px}