@import url("../../admin/css/arrows/arrows.css");
.baAccordionWarp, .baAccordionWarp *{-webkit-box-sizing: border-box; box-sizing: border-box;}
.baAccordionWarp{display: block; width: 100%; height: auto; min-height:200px; position: relative; background-color: rgba(0,0,0,.05); margin:0 auto; color: #333;}
.baAccordionWarp.ItemReady{background: none; overflow: hidden;}
.baAccordionWarp::before{position: absolute; left: 50%; top: 50%; margin: -15px 0 0 -15px; content: ''; border:6px solid rgba(100, 100, 100, .2); border-top:6px solid #0343f3; border-radius: 50%; width: 30px; height: 30px; -webkit-animation: best-spin 2s linear infinite; animation: best-spin 2s linear infinite;}
.baAccordionWarp > *, .baAccordionWarp.ItemReady::before{display: none;}
.baAccordionWarp.ItemReady > *, .ba__card, .ba__header > *{display:block; display:-ms-flexbox!important; display:flex; overflow: visible; -ms-flex-direction: column; flex-direction: column; margin: 0;}
.baAccordion{position: relative; overflow: hidden; margin: 0; padding: 0; width: 100%;}
.baAccordion > *{list-style: none; overflow: hidden; padding: 0 0 10px 0;}
.baAccordion .ba__card{overflow: hidden;}
.baAccordion .ba__header, .baAccordion .ba__body{overflow: hidden; width: 100%; padding:0; margin: 0; position: relative;}
.baAccordion .ba__body{background-color:#fff; padding:0; margin:0;}
.baAccordion.vertical .ba__body{height: 0;}
.baAccordion .ba__header{margin:0; padding:0; font-size: 120%; cursor: pointer; opacity: 1; display: block; position: relative; background:#f6f8f9; border:1px solid rgba(150, 150, 150, .3); border-radius: .3em;}
.baAccordion > .disable .ba__header{opacity: .5; cursor: not-allowed;}
.baAccordion .ba__header > *{-ms-flex-direction: row;flex-direction: row; -ms-flex-align: center; align-items: center; padding:0;}
.baAccordion .active .ba__header{border-radius: .3em .3em 0 0;}
.baAccordion .ba__body > *{padding: 15px; -webkit-transition: margin .6s, height .5s, opacity .5s; transition: margin .6s, height .5s, opacity .5s; opacity: 0;}
.baAccordion > .active > * > .ba__body{height: auto; display: block; margin:0; opacity: 1; border:1px solid rgba(150, 150, 150, .3); border-top:0; border-radius: 0 0 .3em .3em;}
.baAccordion > .active:not([data-collapsible]) > * > .ba__body > *{margin: 0!important; opacity: 1!important}
.baAccordion > .disable > div, .baAccordion > .active[data-collapsible] .ba__body_inside{opacity:0!important;}
.baAccordion.horizontal{-ms-flex-wrap: nowrap;flex-wrap: nowrap; -ms-flex-direction: row; flex-direction: row; -ms-flex-align: stretch; align-items: stretch;}
.baAccordion.horizontal > *{ float: left; padding:0 2px; margin: 0 5px; width:auto; min-width: 68px;}
.baAccordion.horizontal > * > *{height: 100%; min-height: 100%; -ms-flex-direction: row; flex-direction: row;}
.baAccordion.horizontal .ba__card{width:100%; height: 100%; padding: 0; position: relative; min-height:15rem;}
.baAccordion.horizontal .ba__header{width: 60px; min-width: 60px;max-width: 100%;max-height: 100%; margin:0;}
.baAccordion.horizontal .active .ba__header{border-radius: .3em 0 0 .3em;}
.baAccordion.horizontal > .active .ba__body{border: 1px solid rgba(150, 150, 150, .3); border-left:0; border-radius: 0 .3em .3em 0;}
.horizontal .ba__header > *{-webkit-transform-origin:0 0; transform-origin:0 0; -webkit-transform:rotate(-90deg); transform:rotate(-90deg); width: 100%; position:absolute; left:0; bottom:0; text-align: left; white-space: nowrap; -ms-flex-direction: row; flex-direction: row; -ms-flex-align: center; align-items: center;}
.baAccordion.horizontal .ba__body > *{display: table; width:80vw; height: 100%; margin-right:-80vw;}
.baAccordion img{display: block; max-width: 100%; height: auto;}
@-webkit-keyframes best-spin {0% {-webkit-transform: rotate(0deg);}100% {-webkit-transform:rotate(360deg);}}
@keyframes best-spin {0% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}100%{-webkit-transform: rotate(360deg);transform: rotate(360deg);}}
.ba-infor{display: block; position: relative; margin-bottom: 1em;}
.ba-infor > *{text-transform: uppercase; font-size: .8em;opacity: .7;padding: .1em 1em;border-left: 1px solid;display: inline-block;}
.ba-infor > :first-child{padding-left: 0; border: 0;}
.baAccordion.vertical > .active > * > * > .ba__body_inside{height: auto !important;}
.baAccordionWarp .ba__dots{list-style: none; padding:5px; margin: 0 auto; text-align: center;width:auto; display: table;}
.baAccordionWarp .ba__dots > *{display:table-cell;width: 16px;height: 16px;background: rgba(0,0,0,.2);margin: 0 5px;color: #fff; text-align: center; cursor: pointer; text-indent: -5em; float: left; padding: 0; overflow: hidden; border-radius: 50%;}
.baAccordionWarp .ba__dots > * > *{width: 100%; height: 100%; display: block;}
.baAccordionWarp .ba__dots > .active{background-color: rgb(219, 69, 69)}
.baAccordionWarp .ba__arrows{display: block; float: left; text-transform: uppercase; font-size: .8em; text-transform: uppercase; cursor: pointer; font-weight: bold;}
.baAccordionWarp .ba__arrows.next{float: right;}

/* ////////// SKINS /////////////////*/
/*GLOBAL*/
.baAccordion .ba__header .toggle__icon{float: left; margin:0; -ms-flex-order:-1; order:-1; position: relative; z-index: 1;}
.baAccordion .ba__header .toggle__icon::after{position: absolute; right: 0; top: 50%;width: 0; height: 0; display: block; content: ''; border: 10px solid transparent; z-index: -1;}
.baAccordion .ba__header > * > *{padding:20px; height: 100%; line-height: 1;}
.baAccordion.icon__right .toggle__icon{float: right;margin-left:auto;-ms-flex-order: 2;order: 2;}

/*SKIN1*/
.baAccordionWarp.style1 .ba__header > *, .baAccordionWarp.style1 .ba__header > * > *{padding:10px;}

/*SKIN2*/
.baAccordionWarp.style2 .ba__header{background: #2b3544; color: #fff;}
.baAccordionWarp.style2 .active .ba__header{background: #d28cbd;}
.baAccordionWarp.style2 .ba__header .toggle__icon{background: rgba(88, 88, 88, 0.5); }

/*SKIN3*/
.baAccordionWarp.style3 .ba__card{border-radius: 0;}
.baAccordionWarp.style3 .ba__header .toggle__icon{background:#15bf81; color: #fff; border-color: #15bf81;}
.baAccordionWarp.style3 .ba__header .toggle__icon::after{border-left-color:inherit; right: -20px; margin-top: -10px;}
.baAccordionWarp.style3 > .icon__right .ba__header .toggle__icon::after{left: -20px; border-right-color:inherit; border-left-color: transparent;}

/*SKIN4*/
.baAccordionWarp.style4 .ba__card{border-radius: 0;}
.baAccordionWarp.style4 .ba__header{background: #4d5f7a; color: #fff; border:none}
.baAccordionWarp.style4 .ba__header .toggle__icon{overflow: hidden; background: none !important; border-color: #0095ff;}
.baAccordionWarp.style4 .ba__header .toggle__icon::after{border-left-color:inherit; margin-top: -60px; border-width: 60px 0 60px 60px;}
.baAccordionWarp.style4 > .icon__right .ba__header .toggle__icon::after{left:0; border-right-color:inherit; border-width: 60px 60px 60px 0;}

/*SKIN5*/
.baAccordionWarp.style5 .ba__card{border-radius: 0;}
.baAccordionWarp.style5 .ba__header .toggle__icon{overflow: hidden; border-color: #ffba5a; background: none !important; color: #fff;}
.baAccordionWarp.style5 .ba__header .toggle__icon::after{width: 5em;height: 5em;border:3em solid; border-color: inherit; top: 0; -webkit-transform: skew(10deg); transform: skew(10deg); right: .1em;}
.baAccordionWarp.style5 > .icon__right .ba__header .toggle__icon::after{left:.5em;}

/*SKIN6*/
.baAccordionWarp.style6 .ba__card{border-radius: 0;}
.baAccordionWarp.style6 .ba__header{background: #2b3544; color: #fff; border: none;}
.baAccordionWarp.style6 .ba__header .toggle__icon{overflow: hidden; border-color: #ff6666; background: none !important; color: #fff;}
.baAccordionWarp.style6 .ba__header .toggle__icon::after{width: 5em;height: 5em; border:3em solid; border-color: inherit; top: 0; -webkit-transform: skew(-10deg); transform: skew(-10deg); right: .5em;}
.baAccordionWarp.style6 > .icon__right .ba__header .toggle__icon::after{left:.1em;}

/*SKIN7*/
.baAccordionWarp.style7 .ba__card{border-radius:0;}
.baAccordionWarp.style7 .ba__header{background: #78d8de; color: #fff; border:none}
.baAccordionWarp.style7 .ba__header .toggle__icon{background: #2b3544; bottom-color:#2b3544;}
.baAccordionWarp.style7 .ba__header .toggle__icon::after{border-width: 0 1em 1em 0;border-bottom-color:inherit;right: -.9em;top: auto;bottom: 0;}
.baAccordionWarp.style7 > .icon__right .ba__header .toggle__icon::after{left:-.97em; border-width: 0 0 1em 1em;}

/*SKIN8*/
.baAccordionWarp.style8 .ba__header{background: #898ddd; color: #fff;}
.baAccordionWarp.style8 .ba__header .toggle__icon,
.baAccordionWarp.style9 .ba__header .toggle__icon{background:#fff; color: #333; border-radius: .2em; width: 2em;height: 2em;line-height: 2em; text-align: center; padding: 0; margin-left: .5em;}
.baAccordionWarp.style8 > .icon__right .ba__header .toggle__icon,
.baAccordionWarp.style9 > .icon__right .ba__header .toggle__icon{margin: 0 .5em 0 auto;}

/*SKIN9*/
.baAccordionWarp.style9 .ba__header{background: #a3c265; color: #fff;}
.baAccordionWarp.style9 .ba__header .toggle__icon{border-radius: 50%;}

/*SKIN10*/
.baAccordionWarp.style10 .ba__header > *, .baAccordionWarp.style10 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style10 .ba__card{border: none; border-radius: 0;}
.baAccordionWarp.style10 .ba__header{border-left: 3px solid #000; background: #e8ecee;}
.baAccordionWarp.style10 .active .ba__header{border-left-color: #ff6666;}

/*SKIN11*/
.baAccordionWarp.style11 .ba__header > *, .baAccordionWarp.style11 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style11 .ba__card{background:#fff; border-radius: 0;}
.baAccordionWarp.style11 .active .ba__header{border-top:5px solid #a78375;}

/*SKIN12*/
.baAccordionWarp.style12 .ba__header > *, .baAccordionWarp.style12 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style12 .ba__header{border-radius:2em;}
.baAccordionWarp.style12 .active .ba__header{background: #15bf81; color:#fff; border-radius: 2em 2em 0 0;}
.baAccordionWarp.style12 .horizontal .active .ba__header{border-radius:2em 0 0 2em;}
.baAccordionWarp.style12 .active .ba__body{border-radius: 0  0 2em 2em;}
.baAccordionWarp.style12 .horizontal .active .ba__body{border-radius:0 2em 2em 0;}

/*SKIN13*/
.baAccordionWarp.style13 .ba__header > *, .baAccordionWarp.style13 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style13 .active .ba__body, .baAccordionWarp.style13 .ba__header{border-radius: 0 !important; border: none;}
.baAccordionWarp.style13 .ba__header{border-width: 0 0 2px 2px; border-style: solid; border-color: #ffba5a;}

/*SKIN14*/
.baAccordionWarp.style14 .active .ba__body{border-radius: 0; border:0;}
.baAccordionWarp.style14 .ba__header{border:0; border-bottom:2px solid #537ca6; background: #f9f9f9; border-radius: 0 !important;}
.baAccordionWarp.style14 > .horizontal .ba__header{border-right:2px solid #537ca6; border-bottom:0;}
.baAccordionWarp.style14 .ba__header .toggle__icon{background: #537ca6; color: #fff;}

/*SKIN15*/
.baAccordionWarp.style15 > *{padding-left: 3.3em;}
.baAccordionWarp.style15 > .icon__right{padding-left:0; padding-right: 3.3em;}
.baAccordionWarp.style15 > *, .baAccordionWarp.style15 > * > *, .baAccordionWarp.style15 .ba__card, .baAccordionWarp.style15 .ba__header{overflow: visible;}
.baAccordionWarp.style15 .ba__header{background: #50bff2; color: #fff;}
.baAccordionWarp.style15 .ba__header .toggle__icon{background: #50bff2; margin-left: -2.5em; border-radius: .2em; padding: 20px 12px;}
.baAccordionWarp.style15 > .icon__right .ba__header .toggle__icon{margin: 0 -2.5em 0 auto;}
.baAccordionWarp.style15 > .horizontal{padding: 0 0 3.3em 0;}
.baAccordionWarp.style15 > .horizontal .ba__header .toggle__icon{margin-left:-2.5em;}
.baAccordionWarp.style15 > .horizontal.icon__right{padding: 3.3em 0 0 0;}
.baAccordionWarp.style15 > .horizontal.icon__right .ba__header .toggle__icon{margin:0 -2.5em 0 auto}

/*SKIN16*/
.baAccordionWarp.style16 > *{padding-left: .5em;}
.baAccordionWarp.style16 > .icon__right{padding-left:0; padding-right: .51em;}
.baAccordionWarp.style16 > *, .baAccordionWarp.style16 > * > *, .baAccordionWarp.style16 .ba__card, .baAccordionWarp.style16 .ba__header{overflow: visible; border-radius: 0 !important;}
.baAccordionWarp.style16 .ba__header .toggle__icon{background: #4d5f7a; margin-left: -.5em; color: #fff;}
.baAccordionWarp.style16 .active .ba__header .toggle__icon{background: #ff6666; border-color: #ff6666;}
.baAccordionWarp.style16 .active .ba__header .toggle__icon::after{border-width: 10px 0 0 10px; border-top-color: inherit; left: 0; top: 100%;}
.baAccordionWarp.style16 > .icon__right .ba__header .toggle__icon{margin:0 -.5em 0 auto;}
.baAccordionWarp.style16 > .icon__right .ba__header .toggle__icon::after{border-width: 10px 10px 0 0; left: auto;}
.baAccordionWarp.style16 > .horizontal{padding: 0 0 .5em 0;}
.baAccordionWarp.style16 > .horizontal .ba__header .toggle__icon{margin:0 0 0 -.5em;}
.baAccordionWarp.style16 > .horizontal.icon__right{padding: .5em 0 0 0;}

/*SKIN17*/
.baAccordionWarp.style17 > *{padding-left: 1.1em;}
.baAccordionWarp.style17 > *, .baAccordionWarp.style17 > * > *, .baAccordionWarp.style17 .ba__card, .baAccordionWarp.style17 .ba__header{overflow: visible;}
.baAccordionWarp.style17 .ba__header .toggle__icon{background: #3a485d; color: #fff; width: 2em;height: 2em; margin-left: -1em; border-radius: .3em; line-height: 2em; text-align: center; padding: 0;}
.baAccordionWarp.style17 .active .ba__header .toggle__icon{background: #0095ff;}
.baAccordionWarp.style17 > .icon__right{padding-right: 1.1em;}
.baAccordionWarp.style17 > .icon__right .ba__header .toggle__icon{margin: 0 -1em 0 auto;}
.baAccordionWarp.style17 > .horizontal{padding: 0 0 1.1em 0;}
.baAccordionWarp.style17 > .horizontal .ba__header > *{padding-left: 1.8em;}
.baAccordionWarp.style17 > .horizontal .ba__header .toggle__icon{margin-left: -2.6em;}
.baAccordionWarp.style17 > .horizontal.icon__right{padding: 1.1em 0 0;}
.baAccordionWarp.style17 > .horizontal.icon__right .ba__header .toggle__icon{margin:0 .9em 0 auto;}

/*SKIN18*/
.baAccordionWarp.style18 > *{padding-left: 3.5em;}
.baAccordionWarp.style18 > .icon__right{padding-left:0; padding-right: 3.5em;}
.baAccordionWarp.style18 > *::before{position: absolute; left:1.9em; top:1.4em; width: 3px; height: 90%; display: block; content: ''; background: #2b3544; z-index: -1;}
.baAccordionWarp.style18 > .icon__right::before{left: auto; right: 1.9em;}
.baAccordionWarp.style18 > *, .baAccordionWarp.style18 > * > *,.baAccordionWarp.style18 .ba__card, .baAccordionWarp.style18 .ba__header{overflow: visible; border: 0;}
.baAccordionWarp.style18 .ba__body{border:none; border-radius:.3em; -webkit-box-shadow: 0 0 9px rgba(0,0,0,.2) inset; box-shadow: 0 0 9px rgba(0,0,0,.2) inset;}
.baAccordionWarp.style18 .ba__header{background:none; -webkit-box-shadow: none; box-shadow: none;}
.baAccordionWarp.style18 .ba__header .toggle__icon{background: #ffba5a; margin-left: -2.8em; border-radius: .2em;}
.baAccordionWarp.style18 > .icon__right .ba__header > *{padding-left: 0;}
.baAccordionWarp.style18 > .icon__right .ba__header .toggle__icon{margin: 0 -2.8em 0 auto;}
.baAccordionWarp.style18 > .horizontal::before{width: 90%; height: 3px; top: auto; bottom: 1.5em;}
.baAccordionWarp.style18 > .horizontal{padding: 0 0 3.5em 0;}
.baAccordionWarp.style18 > .horizontal .ba__header > *{padding-left: .5em;}
.baAccordionWarp.style18 > .horizontal .ba__header .toggle__icon{margin:0 0 0 -3.4em;}
.baAccordionWarp.style18 > .horizontal.icon__right{padding: 3.5em 0 0 0;}
.baAccordionWarp.style18 > .horizontal.icon__right .ba__header .toggle__icon{margin: 0 -2.8em 0 auto}
.baAccordionWarp.style18 > .horizontal.icon__right::before{top: 1.4em;}

/*SKIN19*/
.baAccordionWarp.style19 .ba__card{border-radius: 0; border: none;}
.baAccordionWarp.style19 .ba__header{background: #d28cbd; color: #fff; border-radius: 0 !important;}
.baAccordionWarp.style19 .active .ba__body{border-width: 0 0 5px 5px; border-style:double; border-color: #d28cbd; border-radius: 0;}
.baAccordionWarp.style19 .ba__header .toggle__icon{background:#fff; color: #333; border-radius: .2em; width: 2em;height: 2em;line-height: 2em; padding: 0; text-align: center; margin-left: .5em; border-radius: 50%; z-index: 1;}
.baAccordionWarp.style19 .ba__header .toggle__icon::after{right: 85%;width: 200%;color:#fff; border-color: currentColor; border-width: 2px 0; outline: 1px solid; outline-offset: 3px;margin-top: -2px;}
.baAccordionWarp.style19 > .icon__right > .active .ba__body{border-width: 0 5px 5px 0;}
.baAccordionWarp.style19 > .icon__right .ba__header .toggle__icon{margin: 0 .5em 0 auto;}
.baAccordionWarp.style19 > .icon__right .ba__header .toggle__icon::after{left: 50%; right: auto;}
.baAccordionWarp.style19 > .horizontal.icon__right .ba__header .toggle__icon{margin-top: 0;}
.baAccordionWarp.style19 > .horizontal > .active .ba__body{border-width: 0 5px 5px 0; border-style:double; border-color: #d28cbd;}
.baAccordionWarp.style19 > .icon__right.horizontal > .active .ba__body{border-width: 5px 5px 0 0;}

/*SKIN20*/
.baAccordionWarp.style20 .ba__card, .baAccordionWarp.style20 > .baAccordion .ba__body{border:0;background:none;}
.baAccordionWarp.style20 .baAccordion .ba__header{border-width:0 0 3px 0; border-style: solid; border-radius:2em;}
.baAccordionWarp.style20 .ba__header > *, .baAccordionWarp.style20 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style20 .baAccordion > .active .ba__header{border-color: #15bf81; border-width: 0 0 2px; overflow: visible; z-index: 5;}
.baAccordionWarp.style20 .active .ba__header::before{position: absolute; left:8%; bottom:-1.6em; width:0; height:0; display: block; content: ''; border: .8em solid transparent; border-top-color: inherit;}
.baAccordionWarp.style20 > .icon__right  .active .ba__header::before{right: 8%; left: auto;}
.baAccordionWarp.style20 > .baAccordion.horizontal .ba__header{border-width:0 3px 0 0;}
.baAccordionWarp.style20 > .horizontal .active .ba__header::before{right: -1.6em; bottom: 8%; left: auto; border-color: transparent; border-left-color: inherit;}
.baAccordionWarp.style20 > .horizontal.icon__right  .active .ba__header::before{top: 8%;}

/*SKIN21*/
.baAccordionWarp.style21 > *{padding-left: 1.2em;}
.baAccordionWarp.style21 > *::before{position: absolute; left:1.1em; top: 0; border-width: 0 0 0 1px; border-style: dashed; content: ''; display: block; width: 0;height: 100%;}
.baAccordionWarp.style21 > *, .baAccordionWarp.style21 > * > *, .baAccordionWarp.style21 .ba__card, .baAccordionWarp.style21 > .baAccordion .ba__card > *{overflow: visible; border: none; background: none; border-radius: 0;}
.baAccordionWarp.style21 > .baAccordion .ba__body{overflow: hidden;}
.baAccordionWarp.style21 .ba__header .toggle__icon{background: #3a485d; color: #fff; width: 2em;height: 2em; line-height: 2em; margin-left: -1em; border-radius:50%; padding: 0; text-align: center;}
.baAccordionWarp.style21 .active .ba__header .toggle__icon{background: #ff6666;}
.baAccordionWarp.style21 > .icon__right{padding-right: 1.2em;}
.baAccordionWarp.style21 > .icon__right::before{left: auto; right: 1.1em;}
.baAccordionWarp.style21 > .icon__right .ba__header .toggle__icon{margin:0 -1em 0 auto;}
.baAccordionWarp.style21 > .horizontal{padding: 0 0 1.2em 0;}
.baAccordionWarp.style21 > .horizontal::before{width: 100%; height: 0; border-width: 0 0 1px 0; left: 0; top: auto; bottom: 1em;}
.baAccordionWarp.style21 > .horizontal .ba__header .toggle__icon{margin:0 0 0 -1em;}
.baAccordionWarp.style21 > .horizontal.icon__right{padding: 1.3em 0 0;}
.baAccordionWarp.style21 > .horizontal.icon__right::before{top: 1.2em; left: 0; border-width: 1px 0 0;}
.baAccordionWarp.style21 > .horizontal.icon__right .ba__header .toggle__icon{margin:0 -1em 0 auto;}

/*SKIN22*/
.baAccordionWarp.style22 > *{padding:0 .5em; }
.baAccordionWarp.style22 .ba__header > *, .baAccordionWarp.style22 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style22 > *, .baAccordionWarp.style22 > * > *, .baAccordionWarp.style22 .ba__card, .baAccordionWarp.style22 .ba__card > *{overflow: visible;border: 0; border-radius: 0;}
.baAccordionWarp.style22 .ba__header{background:#a3c265; width: auto; border: none; margin: 0 -.5em; border-radius: 0 !important;}
.baAccordionWarp.style22 .ba__body{background: #fff; -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2); box-shadow: 0 0 3px rgba(0,0,0,.2); overflow: hidden;}
.baAccordionWarp.style22 .ba__header::before,
.baAccordionWarp.style22 .ba__header::after{position: absolute; left: 0; top: 100%; border: 10px solid transparent; content: ''; width: 0; height: 0; display: block; z-index: -1;}
.baAccordionWarp.style22 .active .ba__header::before{border-width: 10px 0 0 10px; border-top-color: #000;}
.baAccordionWarp.style22 .active .ba__header::after{right: 0; left: auto; border-width: 10px 10px 0 0; border-top-color: #000;}
.baAccordionWarp.style22 > .horizontal{padding: .5em 0;}
.baAccordionWarp.style22 > .horizontal .ba__header{margin: 0;}
.baAccordionWarp.style22 > .horizontal .ba__body{margin:.5em 0;}
.baAccordionWarp.style22 > .horizontal .active .ba__header::before{border-width: 0 0 10px 10px; border-left-color: #000;left: auto; right: -.5em;top: auto; bottom: 0;}
.baAccordionWarp.style22 > .horizontal .active .ba__header::after{right:-.5em; left: auto; top:0; border-width:0 10px 10px 0; border-color: transparent transparent #000;}

/*SKIN23*/
.baAccordionWarp.style23 .ba__header > *, .baAccordionWarp.style23 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style23{border-radius: 1em; border: 1px solid #0095ff;}
.baAccordionWarp.style23 > *, .baAccordionWarp.style23 > * > *, .baAccordionWarp.style23 .ba__header,
.baAccordionWarp.style23 .baAccordion > .active .ba__body{border-radius: 0 !important; border:none;}
.baAccordionWarp.style23 > * > *, .baAccordionWarp.style23 > .horizontal > *{padding: 0; margin: 0;}
.baAccordionWarp.style23 > * > * + * .ba__header{border-top: 1px solid #0095ff;}
.baAccordionWarp.style23 > .horizontal > * + * .ba__header{border-left: 1px solid #0095ff; border-top: none;}
.baAccordionWarp.style23 > * > .active .ba__header{background: #0095ff; color: #fff;}

/*SKIN24*/
.baAccordionWarp.style24 .ba__header > *, .baAccordionWarp.style24 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style24 .ba__body{border:none; background: #50bff2; color: #fff; overflow: visible; position: relative;}
.baAccordionWarp.style24 .ba__header{background: #3a485d; overflow: visible; color: #fff;}
.baAccordionWarp.style24 .active .ba__body{border-color: #50bff2;}
.baAccordionWarp.style24 .active .ba__body::before{position: absolute; left: 8%; top: -1em; border: .5em solid transparent; border-bottom-color: inherit; content: ''; width: 0; height: 0; display: block; z-index: 3;}
.baAccordionWarp.style24 > .horizontal > .active .ba__body::before{top: auto; bottom: 8%; left: -1em; border-color: transparent; border-right-color: inherit;}

/*SKIN25*/
.baAccordionWarp.style25 .ba__header > *, .baAccordionWarp.style25 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style25 .ba__card, .baAccordionWarp.style25 .ba__card > *{border-radius: 0; border:none; background:none;}
.baAccordionWarp.style25 .ba__header{border-bottom: 1px solid; background: none;}
.baAccordionWarp.style25 > .horizontal .ba__header{border-right: 1px solid; border-bottom: none;}
.baAccordionWarp.style25 .active .ba__header{color: #ff6666;}

/*SKIN26*/
.baAccordionWarp.style26 .ba__header > *, .baAccordionWarp.style26 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style26 .ba__card, .baAccordionWarp.style26 > .baAccordion .ba__card > *{border-radius: 0; border:none; background:none;}
.baAccordionWarp.style26 > .baAccordion .ba__header{border-radius: 2em 0 2em 0;}
.baAccordionWarp.style26 .active .ba__header{background: #ff6666; color: #fff;}
.baAccordionWarp.style26 .active > .ba__body{background: none; border: none;}

/*SKIN27*/
.baAccordionWarp.style27 .ba__header > *, .baAccordionWarp.style27 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style27 .ba__card, .baAccordionWarp.style27 .ba__card > *{border-radius: 0 !important; border:none; background:none;}
.baAccordionWarp.style27 .ba__header{background: #a78375; color: #fff;}
.baAccordionWarp.style27 .ba__header::before,
.baAccordionWarp.style27 .ba__header::after{position: absolute; left: 0; top: 0; width: 0; height: 0; border-width:1.65em .7em; border-style: solid; border-color: transparent transparent transparent #f8fafb; content: '';}
.baAccordionWarp.style27 .ba__header::after{border-color: transparent #f8fafb transparent transparent; left: auto; right: 0;}
.baAccordionWarp.style27 .ba__header .toggle__icon{padding-left: 1em;}
.baAccordionWarp.style27 > .icon__right .ba__header .toggle__icon{padding-left: 0; padding-right:1em;}
.baAccordionWarp.style27 > .horizontal .ba__header::before,
.baAccordionWarp.style27 > .horizontal .ba__header::after{top: auto; bottom: 0; border-width:.7em 1.65em; border-color: transparent transparent #f8fafb transparent;}
.baAccordionWarp.style27 > .horizontal .ba__header::after{top: 0; border-color:#f8fafb transparent transparent transparent;}

/*SKIN28*/
.baAccordionWarp.style28 .ba__header > *, .baAccordionWarp.style28 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style28 .ba__card, .baAccordionWarp.style28 > .baAccordion .ba__card > *{border-radius: 0; border:none; background:none;}
.baAccordionWarp.style28 > .baAccordion .ba__header{background: #3a485d; color: #fff;}
.baAccordionWarp.style28 .active .ba__header{background: #0095ff;}
.baAccordionWarp.style28 .ba__header::before{position: absolute; left: 0; top: 0; width: 0; height: 0; border:.5em solid; border-color: #f8fafb #777 #777 #f8fafb; content: '';}
.baAccordionWarp.style28 > .icon__right .ba__header::before{border-color: #f8fafb #f8fafb #777 #777; left: auto; right: 0;}

/*SKIN29*/
.baAccordionWarp.style29 .ba__header > *, .baAccordionWarp.style29 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style29 .ba__card, .baAccordionWarp.style29 > .baAccordion .ba__card > *{border:none;}
.baAccordionWarp.style29 .ba__header{background: #898ddd; color: #fff;}
.baAccordionWarp.style29 .ba__header > *{z-index: 9;}
.baAccordionWarp.style29 .active .ba__body{background: #3a485d; color: #fff; position: relative; z-index: 5; overflow: visible;}
.baAccordionWarp.style29 .active .ba__body::before,
.baAccordionWarp.style29 .active .ba__body::after{position: absolute; left: 40%; top: -1em; width: 20%; height: 2em; border-radius: 50%; content: ''; background: inherit; z-index: -1;}
.baAccordionWarp.style29 .active .ba__body::after{width:5%; height: 1em; top: -2em;}
.baAccordionWarp.style29 > .horizontal .active .ba__body::before,
.baAccordionWarp.style29 > .horizontal .active .ba__body::after{left: -1em;  top: 40%; height: 20%; width: 2em;}
.baAccordionWarp.style29 > .horizontal .active .ba__body::after{height:5%; width: 1em; left: -2em;}

/*SKIN30*/
.baAccordionWarp.style30 .ba__card{border: 0;}
.baAccordionWarp.style30 .ba__header > *, .baAccordionWarp.style30 .ba__header > * > *{padding:10px;}
.baAccordionWarp.style30 .ba__header{border-radius: 2em; background: #537ca6; color: #fff;}
.baAccordionWarp.style30 .active .ba__header{border-radius: 2em 2em 0 0;}
.baAccordionWarp.style30 .active .ba__body{border-radius: 0; border-style: double dashed; border-width: 0 2px 6px; border-color: #000;}
.baAccordionWarp.style30 > .horizontal .active .ba__header{border-radius: 2em 0 0 2em;}
.baAccordionWarp.style30 > .horizontal > .active .ba__body{border-style: dashed double; border-width: 2px 6px 2px 0;}