.ekko-lightbox{
    display:-ms-flexbox!important;
    display:flex!important;
    -ms-flex-align:center;
    align-items:center;
    -ms-flex-pack:center;
    justify-content:center;
    padding-right:0!important
}
.ekko-lightbox-container{
    position:relative
}
.ekko-lightbox-container>div.ekko-lightbox-item{
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    width:100%
}
.ekko-lightbox iframe{
    width:100%;
    height:100%
}
.ekko-lightbox-nav-overlay{
    z-index:1;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    display:-ms-flexbox;
    display:flex
}
.ekko-lightbox-nav-overlay a{
    -ms-flex:1;
    flex:1;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:center;
    align-items:center;
    opacity:1;
    transition:opacity .5s;
    color:#fff;
    font-size:30px;
    z-index:1
}
.ekko-lightbox-nav-overlay a>*{
    -ms-flex-positive:1;
    flex-grow:1
}
.ekko-lightbox-nav-overlay a>:focus{
    outline:none
}
.ekko-lightbox-nav-overlay a span{
    padding:0 30px
}
.ekko-lightbox-nav-overlay a:last-child span{
    text-align:right
}
.ekko-lightbox-nav-overlay a:hover{
    text-decoration:none
}
.ekko-lightbox-nav-overlay a:focus{
    outline:none
}
.ekko-lightbox-nav-overlay a.disabled{
    cursor:default;
    visibility:hidden
}
.ekko-lightbox a:hover{
    opacity:1;
    text-decoration:none
}
.ekko-lightbox .modal-dialog{
    display:none
}
.ekko-lightbox .modal-footer{
    text-align:left
}
.ekko-lightbox-loader{
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    width:100%;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:column;
    flex-direction:column;
    -ms-flex-pack:center;
    justify-content:center;
    -ms-flex-align:center;
    align-items:center
}
.ekko-lightbox-loader>div{
    width:40px;
    height:40px;
    position:relative;
    text-align:center
}
.ekko-lightbox-loader>div>div{
    width:100%;
    height:100%;
    border-radius:50%;
    background-color:#fff;
    opacity:.6;
    position:absolute;
    top:0;
    left:0;
    animation:a 2s infinite ease-in-out
}
.ekko-lightbox-loader>div>div:last-child{
    animation-delay:-1s
}
.modal-dialog .ekko-lightbox-loader>div>div{
    background-color:#333
}
@keyframes a{
    0%,to{
        transform:scale(0);
        -webkit-transform:scale(0)
    }
    50%{
        transform:scale(1);
        -webkit-transform:scale(1)
    }
}


/* customised */
@media (min-width: 992px){ 
.ekko-lightbox-nav-overlay a span{margin-left:-80px;}
.ekko-lightbox-nav-overlay a:last-child span{margin-right:-80px;}
}

.ekko-lightbox .modal-dialog{max-width: 60% !important;}
.ekko-lightbox-nav-overlay{height: unset;}
.ekko-lightbox-nav-overlay a{margin-top: 25%}
.ekko-lightbox-nav-overlay a span{ color: #fff;}
.ekko-lightbox{align-items: start;}
.ekko-lightbox-container{position: relative; height: auto !important;}
.ekko-lightbox-nav-overlay a:active {opacity:0;}
.ekko-lightbox-nav-overlay a>:focus{opacity:0; }
 
.ekko-lightbox .modal-header{border-bottom:0;}
.ekko-lightbox .modal-header .close {padding: 1rem 0;}
.ekko-lightbox .modal-body {padding:0;}
.ekko-lightbox .modal-content{background: transparent; border:0;  }
.ekko-lightbox .modal-footer{color:#fff;text-align:center;display:block;border-top:0;margin-top: 56%; }
.modal-backdrop.show {opacity: 0.9 !important;}
.ekko-lightbox .close {font-size: 3rem;font-weight: 100; color: #fff;text-shadow: none;outline: none;}
.ekko-lightbox .close:hover {color: #fff;}
.ekko-lightbox .close span:focus {outline: none;}
.no-touch a:active, .no-touch a:focus, .no-touch a:hover {text-decoration:none;}
.modal-open .modal {overflow-y: overlay !important;}

 
@media (max-width: 834px){ 
.ekko-lightbox .modal-dialog{max-width: 85% !important;}
}
 
@media (max-width: 575.95px){ 
.ekko-lightbox .modal-dialog{max-width: 100% !important;}
.ekko-lightbox-nav-overlay a {margin-top: 22%;}
}