/* ==========================================================
SWIPER CONTAINER
========================================================== */

.bph-slider{

    position:relative;

    width:100%;

    overflow:hidden;

    padding:10px 5px 70px;

}

/* ==========================================================
WRAPPER
========================================================== */

.bph-slider .swiper-wrapper{

    display:flex;

    align-items:stretch;

}

/* ==========================================================
SLIDES
========================================================== */

.bph-slider .swiper-slide{

    height:auto;

    display:flex;

    box-sizing:border-box;

}

.bph-slider .swiper-slide .bph-card{

    width:100%;

}

/* ==========================================================
SLIDER ARROWS
========================================================== */

.bph-prev,
.bph-next{

    position:absolute;

    top:50%;

    transform:translateY(-50%);

    width:50px;

    height:50px;

    border-radius:50%;

    background:rgba(17,17,17,.92);

    color:#fff;

    display:flex;

    justify-content:center;

    align-items:center;

    cursor:pointer;

    font-size:18px;

    z-index:100;

    transition:.35s;

    box-shadow:0 12px 30px rgba(0,0,0,.18);

    opacity:0;

}

.bph-prev{

    left:20px;

}

.bph-next{

    right:20px;

}

.bph-slider:hover .bph-prev,
.bph-slider:hover .bph-next{

    opacity:1;

}

.bph-prev:hover,
.bph-next:hover{

    background:#C79A63;

}
/* ==========================================================
PAGINATION
========================================================== */

.bph-slider .swiper-pagination{

    bottom:5px !important;

}

.bph-slider .swiper-pagination-bullet{

    width:10px;

    height:10px;

    background:#d7d7d7;

    opacity:1;

}

.bph-slider .swiper-pagination-bullet-active{

    background:#C79A63;

    width:30px;

    border-radius:30px;

}