::-webkit-input-placeholder     { opacity:1; color: #fff }
 :-moz-placeholder               { opacity:1; color: #fff}
 ::-moz-placeholder              { opacity:1; color: #fff}
 a { text-decoration: none }

.titre { text-align: center; color: #fff; margin-bottom: 33px }
.titre h2 { font: 48px/normal ProximaNovaA; color: #84825e; font-weight: 900; letter-spacing: 1.2px; margin-bottom: 22px}
.titre p { max-width: 800px; margin: 0 auto; line-height: 24px }

.blcLstExpertise { background-color: #173047 ; padding: 100px 0}
.blcLstExpertise .container { max-width: 1080px; margin: 0 auto }
.blcLstExpertise .blcTxt { display: flex; flex-flow: row wrap; align-items: center; margin-bottom: 48px}
.logo-expertise { margin-bottom: 40px; display: block;}
.blcLstExpertise .titre { margin-bottom: 46px; text-align: left; padding-right: 20px}
.blcLstExpertise .blcTxt .txt p { color: #fff ; margin-bottom: 20px; text-align: justify; } 
.lstImgExpertise .item .inner { display: block; position: relative; max-width: 270px; margin: 0 auto}
.lstImgExpertise .item .inner .img { width: 270px; height: 270px; display: block; position: relative; overflow: hidden;  transition: all 400ms ease-in-out;}
.lstImgExpertise .item .inner .img:after { content: ""; background-color: rgba(23, 48, 71, 0.8); position: absolute; width: 100%; height: 100%; left: 0; top: 0 ;transition: all 400ms ease-in-out; }
.lstImgExpertise .item .inner .img img { display: block; width: 100% }
.lstImgExpertise .item .inner .s-titre { padding: 0 10px; color: #fff; font-size: 18px; font-weight: 700; text-transform: uppercase; position: absolute; left: 0; right: 0; bottom:31px; z-index: 20; text-align: center }
.blcLstExpertise .titre h2 { margin-bottom: 10px; line-height: 48px; font-size: 42px }
.lstImgExpertise .slick-arrow.slick-prev { background-image: url(../png/prev-white.png); left: -80px}
.lstImgExpertise .slick-arrow.slick-next { background-image: url(../png/next-white.png); right: -80px }

.blcLstExpertise.flow-reverse .blcTxt {  flex-direction: row-reverse;}
.blcLstExpertise.flow-reverse { background-color: #152131;}
.blcLstExpertise.flow-reverse .blcLogo { padding-left: 40px }
.blcLstExpertise.flow-reverse .txt {  padding-right: 40px;}
.lstImgExpertise .item .inner .s-titre img  { display: block; margin: 0 auto 30px }
.blcLstExpertise .blcTxt .col { padding: 0;}
.blcLstExpertise .titre span {
    text-transform: uppercase;
}

.slick-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px 0 0;
}
.slick-dots button {
    background-color: #fff;
    border-radius: 50%;
    border: none;
    font-size: 0;
    width: 15px;
    height: 15px;
    padding: 0;
}
.slick-dots .slick-active button { background-color: transparent; border:#fff solid 1px; }
.slick-dots li {
    padding: 0 5px;
}

@media (min-width:1201px) { 
    .lstImgExpertise .item .inner:hover .img:after{  background-color: rgba(23, 48, 71, 0.5); }

 }

@media (max-width:1200px) {  
    .lstImgExpertise .slick-arrow.slick-prev { left: -20px }
    .lstImgExpertise .slick-arrow.slick-next { right: -20px }
    .lstImgExpertise .item .inner .img { width: 100%; height: auto; }
    .lstImgExpertise .item .inner { max-width: 100% }
    .lstImgExpertise { padding: 0 ;}
    .blcLstExpertise.flow-reverse .txt { padding-right: 0;}

}

@media (max-width:991px) { 
    .blcLstExpertise span {
        display: block;
        max-width: 300px;
    }

    
 }


 @media (max-width:767px) { 
    .blcLstExpertise {  padding: 40px 0;}
    .blcLstExpertise .blcTxt { flex-direction: column; }
    .logo-expertise { margin-bottom: 20px }
    .blcLstExpertise .titre { margin-bottom: 20px }
    .blcLstExpertise .blcTxt .col {  padding: 0;}
    .blcLstExpertise.flow-reverse .blcLogo { padding-left: 0 }
    .blcLstExpertise.flow-reverse .txt {  padding-right: 0;}
    .blcLstExpertise.flow-reverse .blcTxt {  flex-direction: column; }
    .lstImgExpertise { padding: 0; }
    .blcLstExpertise .blcTxt { margin-bottom: 20px }
    .blcLstExpertise span {
        display: block;
        max-width:100%;
    }
     .blcLstExpertise .titre h2 { line-height: normal; font-size: 35px}

    


 }



@media (max-width:600px) { 
    .blcLstExpertise .container {
        width: 100%;
    }


}