.BlockService {
    width: 100%;
    display: block;
    background: #ebebeb;
    position: relative;
    overflow: hidden;
}
.TitService span {
    padding: 20px;
    border-right: none !important;
    /* border: 5px solid #fff200; */
    padding-left: 00px;
    margin-right: -60px;
    display: block;
    margin-top: 1px;
    max-width: 290px;
}

.BannerServerLeft {
 
 
    text-align: center;
}
.BannerServerLeft img{
    max-width:100%;
}
.BannerServerRight {

 

    text-align: center; 
}

.BannerServerRight  img{
    max-width:100%;
}

.TitreBannerService {}

.TitreBannerService {/* Safari */
    -webkit-transform: rotate(-90deg);    /* Firefox */
    -moz-transform: rotate(-90deg);    /* IE */
    -ms-transform: rotate(-90deg);    /* Opera */
    -o-transform: rotate(-90deg);    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    color: #022862;
    font-size: 50px;
    position: absolute;
    font-family: 'Mayeka Bold Demo';
    left: calc(50% - 125px);
    top: calc(50%  - 37px);
    text-transform: uppercase;
    font-weight: bold;
}

.ContentBannerService {
    position: relative;
    display: block;
    clear: both;
    height: 100%;
    float: left;
    width: 100%;
}

.TitreImgService {
    text-align: center;
    position: relative;
}
.TitService a{
    color: #fff200;
    text-decoration:none;
 
    display: block;
}
.TitService span:after{
    position:absolute;
    content:"";
    height: 14px;
    width:5px;
    background:#fff200;
    top: 0px;
    right: 00px;
}
.TitService span:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 5px;
    background: #fff200;
    bottom: 0px;
    right: 0px;
}

.TitService {

/* width: 100%; */

z-index: 999;

font-size: 25px;

font-family: 'Mayeka Bold Demo';

color: #fff200;

text-transform: uppercase;

font-weight: 400;

letter-spacing: 2px;

justify-content: center;

left: 0px;

right: 0px;

position: absolute;

top: 50%;

left: 50%;

display: inline-table;

transform: translate(-50%, -50%);

padding: 0px 20px;

border-right: none !important;

border: 5px solid #fff200;
}




@media screen   and (max-width:768px)  {
 .TitreBannerService {/* Safari */
    -webkit-transform: rotate(00deg) !important;    /* Firefox */
    -moz-transform: rotate(00deg) !important;    /* IE */
    -ms-transform: rotate(00deg) !important;      /* Opera */
    -o-transform: rotate(-00deg) !important;     /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0) !important;   
    color: #022862;
    font-size: 30px;
    position: relative !important;   
    font-family: 'Mayeka Bold Demo';
    left: auto !important;   
    top: 20px !important;   
    text-transform: uppercase;
    font-weight: bold;
    width:100% !important;
    text-align:center;
    margin-bottom: 40px;
}
  .Imgservice {
 
    width: 100%;
    padding:0px 0px 20px 0px !important;
}
#Services  .bx-controls-direction {
    position: relative;
    margin-top: 50px;
    margin-bottom: -5px;
    height: 50px;
}
.BlockService:before {
    content: "";
    left: 0px;
    width: 100% !important;
    top: 0px;
    height: 50%  !important;
    background: #fef898;
    position: absolute;
 
}
.BannerServerLeft {
    text-align: center;
    margin-bottom: 35px;
}
}




@media screen    and (min-width:769px)   and (max-width:1000px)  {
.TitService span {
    padding: 20px 10px;
    border-right: none !important;
    /* border: 5px solid #fff200; */
    padding-left: 0px !important;
    margin-right: -21px;
    display: block;
    margin-top: 1px;
    max-width: 199px;
}
.TitService {
    font-size: 16px  !important;
    text-transform: capitalize  !important;
}
.TitreBannerService{
      font-size: 30px   !important;
      left: calc(50% - 75px)   !important;
}
}