.top_inter {
    background-image: url(../img/bg_services.jpg);
display: table;
    width: 100%;
    height: 45vh;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
position: fixed;
top:0;
}
.frame_serv {
    padding: 8vh;
    background-color: #e6e6e6;
    transform: translateX(-5vh);
    font-family: Raleway;
    font-size: 1em;
    text-align: left;
    color: #000;
}

.frame_service:nth-child(2n) .flex_div  .frame_serv {
    transform: translateX(5vh);
}
@media (max-width:767px) {
.frame_serv {    transform: none !important;}
.bx-wrapper ul li {
    width: calc(100vw - 32px) !important;
}
.top_inter 
{
width: 100%;
height: 20vh;
}
.title_top_inter {font-size: 2.3em !important;
width: 90%;}
}

.bx-wrapper .bx-controls-direction a {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 40px;
    height: 40px;
    font-size: 0;
    background-color: #000;
    text-decoration: none;
}
.bx-wrapper .bx-prev {    right:40px !important;}
.bx-wrapper .bx-prev:hover {
    background-color: rgba(0, 0, 0, 0.66);
opacity: 0.6;
}
.bx-wrapper .bx-next:hover {    background-color: rgba(0, 0, 0, 0.66);
opacity: 0.6;
}
 .bx-prev:before{
    content: "\f104";
    font: normal normal normal 20px/1 FontAwesome;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: #fff;
    text-decoration: none;
}

 .bx-next:after{
    content: "\f105";
    font: normal normal normal 20px/1 FontAwesome;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    color: #fff;
    text-decoration: none;
}
.bx-wrapper {
width: 100% !important;
position: relative; 
height: 100% !important;
}
.bx-wrapper img {
max-width: 100% !important;
position: relative; 
}