.ba__drawers-wrap{position: relative; display: block; width: 100%; min-height: 10em; direction: ltr;}
.ba__drawers, .ba__drawers *{-webkit-box-sizing: border-box;box-sizing: border-box;}
.ba__drawers{margin: 0; padding: 0;display: -webkit-box;display: -ms-flexbox;display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; overflow: hidden;}
.ba__drawers-y{-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;}
.ba__drawers > *{-webkit-box-flex: 1;-ms-flex: 1;flex: 1; list-style: none; position: relative; background-repeat:no-repeat;background-position: center center;}
.ba__drawers >:after{position:absolute;top:0;left:0;content:"";display:block;width:100%;height:100%;background-color:rgba(255,255,255,0.6);z-index:2;opacity:0;cursor: pointer;}
.ba__drawers > * > img{position:absolute;top:50%;left:50%;height:auto;width:auto;min-width:100%;min-height:100%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);z-index:1;max-width:none;max-height:none; cursor: pointer;}
.ba__drawers .ba__header{background: #e5e7ec;font-size: 18px;padding: 10px;position: absolute;left: 0;top: 20%; display:none; width: 100%; z-index: 3;}
.ba__drawers .ba__content{position: absolute;left: 1em;bottom: 1em;z-index: 5;background: #fff;padding: 1em;right: 1em; opacity: 0; max-width:100%; z-index: -1;}
.ba__drawers .ba__active .ba__content{opacity: 1; z-index: 9; -webkit-transition: all .3s linear .5s; transition: all .3s linear .5s;}

.ba__drawers-dots{display: block; text-align: center; margin:15px 0;}
.ba__drawers-dots > *{display: inline-block; width: 1em; height: 1em; padding: 0;text-align: center;background: #dce0e8;margin: .2em;line-height: 2;border-radius:2em; cursor: pointer; overflow: hidden; text-indent: -99em;}
.ba__drawers-dots > .active{background:#2a2f36; color: #fff;}
.ba__drawers-wrapper > .ba__drawers-arrows{display: block;float: left;padding: .5em 1em;background: #dce0e8;border-radius: .3em;line-height: 1;text-transform: uppercase;font-size: 12px;font-weight: bold;margin:15px 0;cursor: pointer;}
.ba__drawers-wrapper > .ba__drawers-arrows.next{float: right;}

.ba__drawers.style1 > *{-webkit-box-shadow: 0 0 2em #000; box-shadow: 0 0 2em #000;}

.ba__drawers.style2{border: 15px solid #fff; -webkit-box-shadow: 0 0 15px #ddd; box-shadow: 0 0 15px #ddd; border-radius: .3em;}
.ba__drawers.style2 > *{margin: 1px; overflow: hidden;}
.ba__drawers.style2 .ba__header{display: block;background: rgba(255,255,255,.8);color: #292d37;}
.ba__drawers.style2 .ba__active > .ba__header{display: none;}
.ba__drawers.style2 .ba__content{bottom: -100%; left: 0; right: 0;}
.ba__drawers.style2 .ba__active .ba__content{bottom: 0; opacity: .9;}
.ba__drawers-y.style2 .ba__header{display:table; width: auto;}

.ba__drawers.style3{-webkit-box-shadow: 0 0 1em rgba(25, 36, 68, 0.3);box-shadow: 0 0 1em rgba(25, 36, 68, 0.3); overflow: visible;}
.ba__drawers.style3 > *{margin: 1px; overflow: hidden;}
.ba__drawers.style3 .ba__header{display: block;background: rgba(0,0,0,.8) url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAQAAAADQ4RFAAAAsUlEQVQ4y5XSMQ7CMAwF0N7JI+fp0FsgIa5TCfUECLFFzCxlbgaatcoCRFAau3Zjy16f7O+kelX2+jQUihKozQhqcEaUiBF9iQnNxIAWokY5USJMVIgSDVqRMmJICbFkG/3I7qZH/ynnJ2USyhYL8UIYj1AWP4V4HXPGIRK/uVO2RszF9n2IIXZeQuyRTz6hQ88jlrRDIscHn0l4SjwFI4EkhMmCRAKOkhltEOnvGQm4Nz6l2QrQgiHHAAAAAElFTkSuQmCC') right bottom no-repeat;color: #fff; top: auto; bottom: 0; margin: 0; padding-bottom: 1em;}
.ba__drawers.style3 .ba__active > .ba__header{display: none;}
.ba__drawers.style3 .ba__content{bottom: -100%; left: 0; right: 0; padding-top: 3em;}
.ba__drawers.style3 .ba__active .ba__content{bottom: 0; opacity: .9; background:-webkit-gradient(linear, left bottom, left top, color-stop(60%, #fff), to(rgba(0,0,0,0))); background:linear-gradient(0deg, #fff 60%, rgba(0,0,0,0) 100%);}
.ba__drawers.style3 >:not(.ba__active):after{background-color: rgba(175, 169, 196, 0.6); opacity: 1;}


.ba__drawers.style4{counter-reset:badrawers;}
.ba__drawers.style4 > *{margin: 1px; overflow: hidden;}
.ba__drawers.style4 .ba__header{display: block; background: none; font-size: 0; color: rgba(0,0,0,0);}
.ba__drawers.style4 .ba__header::before{counter-increment:badrawers;content:counter(badrawers);font-size:18px;color:#000;position:absolute;left:calc(50% - 21px);top:50%;width:42px;height:42px;background:#fff;text-align:center;line-height:42px;border-radius:50%;border:0;-webkit-box-shadow:0 0 0 .5em rgba(255,255,255,.5);box-shadow:0 0 0 .5em rgba(255,255,255,.5)}
.ba__drawers.style4 .ba__active > .ba__header{visibility: hidden; opacity: 0;}
.ba__drawers.style4 .ba__content{background:#fff; max-width: 20em; border-radius: .3em;}
.ba__drawers-x.style4 .ba__header{top:calc(50% - 21px); padding: 0; margin: 0;}


.ba__drawers.style5 > *{margin: 1px; overflow: hidden;}
.ba__drawers.style5 .ba__header{display: block;background:rgba(255,255,255,0.8);color:#000}
.ba__drawers.style5 .ba__active > .ba__header{visibility: hidden; opacity: 0;}
.ba__drawers.style5 .ba__content{background:#fff; max-width: 20em;}
.ba__drawers-x.style5 .ba__header{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);left:0;top:auto;bottom:5%;-webkit-transform-origin:0 0;transform-origin:0 0;margin:0; display: table;}


.ba__drawers.style6 > *{margin: 5px; overflow: hidden; border-radius: 5em;}
.ba__drawers.style6 .ba__header{display: block;background:none;color:#fff; text-shadow:1px 1px 1px #000;}
.ba__drawers.style6 .ba__active > .ba__header{visibility: hidden; opacity: 0;}
.ba__drawers.style6 .ba__content{background:rgba(0,0,0,.8);left: 0;bottom: 0;right: 0;color: #fff;}
.ba__drawers-x.style6 .ba__header{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);left:0%;top:auto;bottom:50%;margin:0;}
.ba__drawers.style6 >:not(.ba__active):after{background-color: rgba(0, 0, 0, 0.6); opacity: 1;}

.ba__drawers.style7 > *{margin: 5px; overflow: hidden; border-radius:0 5em;border: 10px solid #d6dde6; -webkit-box-shadow: 0 0 .5em rgba(0,0,0,.1); box-shadow: 0 0 .5em rgba(0,0,0,.1);}
.ba__drawers.style7 .ba__header{display: block;background:none;color:#fff; text-shadow:1px 1px 1px #000;}
.ba__drawers.style7 .ba__active > .ba__header{visibility: hidden; opacity: 0;}
.ba__drawers.style7 .ba__content{background:rgba(255,255,255,.8);left: 0;top: 0;right: 0;bottom: auto; color: #000; max-width: 20em; border-radius: 0 0 .3em 0;}
.ba__drawers-x.style7 .ba__header{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);left:0%;top:auto;bottom:50%;margin:0;}
.ba__drawers.style7 >:not(.ba__active):after{background-color: rgba(51, 35, 35, 0.6); opacity: 1;}

.ba__drawers.style8{overflow: visible;}
.ba__drawers.style8 > *{margin: 5px; overflow: hidden; -webkit-transform: rotate(5deg) skewY(-10deg); transform: rotate(5deg) skewY(-10deg);}
.ba__drawers.style8 .ba__header{display: block;background:rgba(255,255,255,0.8);color:#000}
.ba__drawers.style8 .ba__active > .ba__header{visibility: hidden; opacity: 0;}
.ba__drawers.style8 .ba__content{background:#fff; max-width: 20em;}
.ba__drawers-x.style8 .ba__header{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);left:0;top:auto;bottom:5%;-webkit-transform-origin:0 0;transform-origin:0 0;margin:0; display: table;}