/* footer */
/*bouton reseau sociaux */
/*-- button --*/
:root {
  --bs-vert-pro:#0E918C ;
  --bs-rouge-pro:#C22135 /*#D2111E */;
--bs-gris-pro: rgb(238,242,245);
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40; 
  --bs-gray-900: #212529;}
  .barre-horiz{

filter: grayscale(60%);
}

/* DEBUT LOADR 
  .loader{position: fixed;z-index: 999999;background: #f1f1f1;height: 100%;width: 100%;
    align-items:center; justify-content: center; display: flex;font-size: 150px;}
  .lettre{
    letter-spacing: 15px;
    font-size: 80px;
    color: var(--bs-vert-pro);
    text-shadow: 2px 0px 1px var(--bs-rouge-pro);
    font-family: time new roman;
    margin-bottom: 150px;
    animation: flash 2.5s linear infinite;
  }

  @keyframes flash{
    0%{ color: red;}
    90%{color: green;}
    100%{color: yellow;}
  }
  .lettre:nth-child(1){animation-delay: 0.1s;}
  .lettre:nth-child(2){animation-delay: 0.2s;}
  .lettre:nth-child(3){animation-delay: 0.3s;}
  .lettre:nth-child(4){animation-delay: 0.4s;}
  .lettre:nth-child(5){animation-delay: 0.5s;}
  .lettre:nth-child(6){animation-delay: 0.6s;}
  .lettre:nth-child(7){animation-delay: 0.7s;}

 fin loader */
   .fondu-out{
    display: none;
    transition: opacity 0.4s ease-out;
  }
.btn-hover a{transition-timing-function: ease-in-out;transition: 2s ease-in-out; font-family: inherit;}
.btn-hover a:hover{transition: 2s ease-in-out;color: red;background: white;font-family: sans-serif;}
/*#navbar_top li {border-bottom: 1px solid red;}*/
.bg-vert-pro{background: var( --bs-gray-100);}
.activer {color: var(--bs-rouge-pro);text-transform: inherit;}
.block-team{padding-bottom: 20px;transition: 1s esase-in-out;}
  .rounded-pro{border-radius: 20px  20px 0 0;}
  .block-team img{filter: brightness(1);transition: 1s esase-in-out;}
  .block-team img:hover{filter: brightness(1.40);transition: .1s esase-in-out;}

  .block-org{transition: 2s ease-in-out;padding-top: 20px;}
  .block-org:hover{color: black;transition: 1s ease-in-out;
    text-shadow:1px 1px 2px white;text-transform: capitalize;}
.losange {
    transition: 1s ease-in-out;
    padding-top: 16px;
    height:100px  ;
    width: 100px;
    border:  1px solid var(--bs-rouge-pro) ;
    border-radius: 10px;
    -ms-transform: rotate(45deg); /* Internet Explorer */
    -moz-transform: rotate(45deg); /* Firefox */
    -webkit-transform: rotate(45deg); /* Safari et Chrome */
    -o-transform: rotate(45deg); /* Opera */
    cursor: pointer;
    color: black;
   
}
.losange:hover{
     transition: 1s ease-in-out;
    background: var(--bs-rouge-pro);
color: var(--bs-vert-pro);
    border:  1px solid ;
    border-radius: 10px;
     
     color: white;
}
.losange div{  
  -ms-transform: rotate(-45deg); /* Internet Explorer */
    -moz-transform: rotate(-45deg); /* Firefox */
    -webkit-transform: rotate(-45deg); /* Safari et Chrome */
    -o-transform: rotate(-45deg); /* Opera */
text-transform: capitalize;

}

h4{color: var(--bs-rouge-pro);}
.port-offres{background: white;
             margin: 0;
             left: 0;
             right: 0;
             height: 300px;}
.chif{background: white;
    }
.btn-pro{background: transparent;
    color: var(--bs-vert-pro);
    border: 1px solid var(--bs-gris-pro);
    border-radius: 10px 0;
    padding: 5px;
    transition: 1s ease-in-out;
    

}
.btn-pro:hover,active{
       transition: 1s ease-in-out;
    border-radius: 0 10px ;
    border: 1px solid var(--bs-vert-pro);
        
    
}

.btn-pro-text:hover {
    transform: translate3d(-10px, 0, 0);
    width: 100%;
    height: 100%;
}
.portfolio-col{
    padding: 30px 0px;
    margin:     0;
}
.p
.portfolio-item .card{
    border: none;
}
.pad-top-5{padding-top:5px;}
.portfolio-item .card .card-body{
    box-shadow: 3px 5px 15px rgba(0,0,0, .15);
}
.portfolio-item .card .card-body h4{
    margin-bottom: 12px;
}
.portfolio-item .card .card-body h4 a{
    color: #323232;
    text-decoration: none;
    font-size: 22px;
    text-transform: capitalize;
}
.portfolio-item .card .card-body p{
    margin-bottom: 0px;
}
.hover-box{
    position: relative;
    overflow: hidden;
}
.dot-full{
    background: var(--bs-vert-pro);
    width: 40px;
    height: 40px;
    position: absolute;
    top: -5px;
    right: -5px;
    border-radius: 50px;
    transition: all 0.5s ease 0s;
}
.dot-full i{
    color: #ffffff;
    font-size: 30px;
    width: 80px;
    height: 80px;
    background: #323232;
    text-align: center;
    line-height: 80px;
    border-radius: 50px;
    opacity: 0;
}
.portfolio-item .card:hover .dot-full{
    background: rgba(14,102,82,0.7);
    width: 100%;
    height: 100%;
    border-radius: 0px;
    top: 0px;
    right: 0px;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.portfolio-item .card:hover .dot-full i{
    opacity: 1;
}


.item-pro{
    padding: 30px 0px;
}
.item-pro h3{
    font-size: 20px;
    font-weight: 600;
}
.item-pro ul{
    padding-left: 0px;
}
.item-pro ul li{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    line-height: 30px;
}
.item-pro ul li span{
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}


.project-inner h3{
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 30px;
}
.secteurs{ 
    left: 0;
    right: 0;
    margin: 0;
    background: rgba(14,102,82,0.1);}

.design{
        background-size: cover;
    background-position: 50% 50%;
  background: white;
}
.hb {
    display: inline-block;
    position:relative;
    text-align: center; /*  Default text align center */
    z-index: 0;
}

.hb:before,
.hb:after {
    position: absolute;
    content: "";  
    left: -1px;
    top: 0;
    z-index: -1;
}

.hb:before {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    transform: rotate(60deg);
}

.hb:after {
    -webkit-transform: rotate(-60deg);
    -moz-transform: rotate(-60deg);
    -ms-transform: rotate(-60deg);
    -o-transform: rotate(-60deg);
    transform: rotate(-60deg);
}

.hb i {
    z-index: 9;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
            text-align: center;
}


.hb,
.hb:before,
.hb:after { 
     box-sizing: border-box;

     /* default transition time is set .25s = 250 millisecond  
     Uncomment following if you want to set transition on hexagon color change */ 

     -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
}

.hb-xs-margin {
    margin: 5px;
    display: inline-block;
    overflow: hidden;
}   
.hb-xs {
    line-height: 18.5px;
    font-size: 18.5px;
    margin: 9.5px 0;
}
.hb-xs, .hb-xs::after, .hb-xs::before {
    height: 18.5px;
    width: 32px;
}
.spin,
.spin-icon i {
    -webkit-transition: -webkid-transform .25s  ease;
       -moz-transition: -moz-transform .25s  ease;
        -ms-transition: -ms-transform .25s  ease;
         -o-transition: -o-transform .25s  ease;
            transition: transform .25s  ease;
            text-align: center;
}

.spin-icon:hover i,
.spin:hover {
    -webkit-transform:rotate(360deg);
       -moz-transform:rotate(360deg);
        -ms-transform:rotate(360deg);
         -o-transform:rotate(360deg);
            transform:rotate(360deg);   
}

.hb:hover,
.hb:hover:before,
.hb:hover:after {
    background: transparent;  
    border-left:1px solid #2ecc71;
    border-right:1px solid #2ecc71;  
    color: #2ecc71; /* Default hover font color */
}

.hb-facebook,
.hb-facebook:before,
.hb-facebook:after {
    background: #3B5998;
    border-color: #3B5998;
    color: #ffffff;
}
.hb-facebook:hover,
.hb-facebook:hover:before,
.hb-facebook:hover:after {
    background: transparent;
    border-color: #3B5998;
    color: #3B5998;
}

/* Facebook inverts */
.hb-facebook-inv,
.hb-facebook-inv:after,
.hb-facebook-inv:before {
    color: #3B5998;   
    border-color: #3B5998;
    background: transparent;
}
.hb-facebook-inv:hover,
.hb-facebook-inv:hover:after,
.hb-facebook-inv:hover:before {
    background: #3B5998; 
    border-color: #3B5998;
    color: #ffffff;  
}

.hb-twitter,
.hb-twitter:before,
.hb-twitter:after  {
    background: #55ACEE;
    border-color: #55ACEE;
    color: #ffffff;
}

.hb-twitter:hover,
.hb-twitter:hover:before,
.hb-twitter:hover:after   {
    background: transparent;
    border-color: #55ACEE;
    color: #55ACEE;
}

/* Twitter inverts */
.hb-twitter-inv,
.hb-twitter-inv:after,
.hb-twitter-inv:before {
    background: transparent;
    border-color: #55ACEE;
    color: #55ACEE;
}
.hb-twitter-inv:hover,
.hb-twitter-inv:hover:after,
.hb-twitter-inv:hover:before {
    background: #55ACEE;
    border-color: #55ACEE;
    color: #ffffff;
}


.hb-instagram,
.hb-instagram:before,
.hb-instagram:after  {
    background: #e1306c;
    border-color: #e1306c;
    color: #ffffff;
}

.hb-instagram:hover,
.hb-instagram:hover:before,
.hb-instagram:hover:after   {
    background: transparent;
    border-color: #e1306c;
    color: #e1306c;
}

/* Twitter inverts */
.hb-instagram-inv,
.hb-instagram-inv:after,
.hb-instagram-inv:before {
    background: transparent;
    border-color: #e1306c;
    color: #e1306c;
}
.hb-instagram-inv:hover,
.hb-instagram-inv:hover:after,
.hb-instagram-inv:hover:before {
    background: #e1306c;
    border-color: #e1306c;
    color: #ffffff;
}


.hb-google-plus,
.hb-google-plus:before,
.hb-google-plus:after {
    background: #db514f;
    border-color: #db514f;
    color: #ffffff;
}
.hb-google-plus:hover,
.hb-google-plus:hover:before,
.hb-google-plus:hover:after {
    background:transparent;
    border-color: #db514f;
    color: #db514f;
}
 
/* google-plus inverts */
.hb-google-plus-inv,
.hb-google-plus-inv:after,
.hb-google-plus-inv:before {
    background:transparent;
    border-color: #db514f;
    color: #db514f;
}
.hb-google-plus-inv:hover,
.hb-google-plus-inv:hover:after,
.hb-google-plus-inv:hover:before {
    background: #db514f;
    border-color: #db514f;
    color: #ffffff;
}


.hb-dribbble,
.hb-dribbble:before,
.hb-dribbble:after {
    background: #ea4c89;
    border-color: #ea4c89;
    color: #ffffff;
}
 
.hb-dribbble:hover,
.hb-dribbble:hover:before, 
.hb-dribbble:hover:after {
    background:transparent;
    border-color: #ea4c89;
    color: #ea4c89;
}

/* dribbble inverts */
.hb-dribbble-inv, 
.hb-dribbble-inv:after,
.hb-dribbble-inv:before {
    background:transparent;
    border-color: #ea4c89;
    color: #ea4c89;
}
.hb-dribbble-inv:hover,
.hb-dribbble-inv:hover:after,
.hb-dribbble-inv:hover:before {
    background: #ea4c89;
    border-color: #ea4c89;
    color: #ffffff;
}

.news-box p{
    line-height: 24px;
    margin-bottom: 30px;
}

.newsletter{border: 1px solid green;}

/* ---- reseau end ---- */
.touch-line{
    padding: 40px 0px;
    background: var(--bs-vert-pro);
    position: relative;
    margin-top: 0px;
}

.touch-line p{
    color: #ffffff;
    font-size: 15px;
}
.touch-line a.btn-secondary{
    background-color: #ffffff;
    border-color: #ffffff;
    color: var(--bs-vert-pro);
}
.footer { 
    width:100%; 
    background: url('https://propme.cm/asset/images/footer-bg.png') no-repeat center;
    background-size: cover;
    min-height:250px; 
    padding:10px 0px 25px 0px;
    }
.pt2 { 
    padding-top:40px ;
    margin-bottom:20px ;
    color: #ffffff;
    font-weight: 500;
    }
footer p { 
    font-size:15px; 
    color:#CCC; 
    padding-bottom:0px; 
    margin-bottom:8px;
    }
.mb10 { 
    padding-bottom:0px ;
    }
.footer_ul_amrc { 
    margin:0px ; 
    list-style-type:none ; 
    font-size:14px; 
    padding:0px 0px 10px 0px ; 
    }
.footer_ul_amrc li {
    padding:0px 0px 5px 0px;
    }
.footer_ul_amrc li a{ 
    color:#cccccc;
    font-size: 15px;
    font-weight: 400;
    }
.footer_ul_amrc li a i{
    margin-right: 5px;
}
.footer_ul_amrc li a:hover{ 
    color:#fff; 
    text-decoration:none;
    }
.footer_ul_amrc li .media-left{
    margin-right: 10px;
}
.footer_ul_amrc li .media-left img{
    max-width: 50px;
}
.footer_ul_amrc li .media-body p{
    font-size: 14px;
    font-weight: 500;
    color: #ffffff;
}
.footer_ul_amrc li .media-body span{
    color: #cccccc;
    font-size: 14px;
    font-weight: 400;
}
.fleft { 
    float:left;
    }
.padding-right { 
    padding-right:10px; 
    }
.footer_ul2_amrc {
    margin:0px; 
    list-style-type:none; 
    padding:0px;
    }
.footer_ul2_amrc li p { 
    display:table; 
    }
.footer_ul2_amrc li a:hover { 
    text-decoration:none;
    }
.footer_ul2_amrc li i { 
    margin-top:5px;
    }
.footer_ul2_amrc li a {
    color: var(--bs-vert-pro);
    font-size: 12px;
}
.bottom_border { 
    border-bottom:1px solid #323f45; 
    padding-bottom:20px;
    }
.activ_er{
       border-top:1px solid red;
       transition: all 0.5s linear;
       color: var(--bs-rouge-pro);
       box-shadow: 1px 2px 8px rgba(0,0,0, .15);
       border-radius: 0 10px;      
}
#navbar_top a{
  border-bottom: none;
       transition: all 0.5s linear;
   }
#navbar_top a:hover{

       transition:all 0.5s linear;
       color: var(--bs-rouge-pro);
       box-shadow: 0px 0px 8px rgba(0,0,0, .15);
       border-radius: 0 10px;
   }



.foote_bottom_ul_amrc {
    list-style-type:none;
    padding:0px;
    display:table;
    margin-top: 10px;
    margin-right: auto;
    margin-bottom: 10px;
    margin-left: auto;
}
.foote_bottom_ul_amrc li { 
    display:inline;
    }
.foote_bottom_ul_amrc li a {
    color:#ffffff; 
    margin:0 12px;
    font-size: 16px;
    font-weight: 300;
    }
.footer-logo{
    padding: 20px 0px;
    text-align: center;
}
.copyright{
    margin-top: 30px;
}
.copyright a{
    color: var(--bs-vert-pro);
    text-decoration: underline;
}
.copyright a:hover{
    color: #ffffff;
    text-decoration: none;
}
.social_footer_ul { 
    display:table; 
    margin:15px auto 0 auto; 
    list-style-type:none;
    padding: 0; 
    }
.social_footer_ul li { 
    padding-left:20px; 
    padding-top:10px; 
    float:left; 
    }
.social_footer_ul li a { 
    color:#CCC; 
    border:2px solid #CCC; 
    padding:8px;
    border-radius:50%;
    }
.social_footer_ul li i {  
    width:20px; 
    height:20px; 
    text-align:center;
    }
.social_footer_ul li a:hover {
    color: var(--bs-vert-pro); 
    border:2px solid var(--bs-vert-pro); 
}

.footer-social{
    margin: 0px;
    padding: 0px;
    list-style: none;
}
.footer-social li{
    display: inline-block;
}
/* End Footer */
.full-title{
    z-index: 0;
    padding: 100px 0px 0px 0px;
    background: url('https://propme.cm/asset/images/banniere.jpg') no-repeat center;
    position: relative;
background-position: center;
}
.full-title:before{
    content: "";
    background: rgba(14,102,82,0.1);
    top: 0px;
    left: 0px;
    position: absolute;
    width: 100%;
    height: 100%;
}
.full-title h1{
    position: relative;
    color: #ffffff;
    font-size: 38px;
    text-align: center;
}
.full-title h1 small{
    float: right;
    padding: 15px 0px;
    font-size: 14px;
}
.breadcrumb-main{
    position: relative;
    max-width: 400px;
    margin: 0 auto;
    text-align: center;
}
.breadcrumb-main .breadcrumb{
    background: var(--bs-vert-pro);
    border-radius: 100px 100px 0px 0px;
    display: block;
}
.breadcrumb-main .breadcrumb li a{
    color: #ffffff;
    font-size: 15px;
}
.breadcrumb-main .breadcrumb li{
    color: black;
    display: inline-block;
    font-size: 15px;
}
.breadcrumb-main .breadcrumb-item + .breadcrumb-item::before{
    color: var(--bs-rouge-pro);
}
.top-bar{
    background: var(--bs-vert-pro);
    padding: 4px 0px;
}
.social-media ul{
    list-style: none;
    margin: 0px;
    padding: 0px;
}
.social-media ul li{
    display: inline-block;
    padding: 0px 5px;
}
.social-media ul li a{
    font-size: 16px;
    color: #ffffff;
}
.social-media ul li a:hover{
    color: var(--bs-rouge-pro);
}

.contact-details ul{
    list-style: none;
    margin: 0px;
    padding: 0px;
    float: right;
}
.contact-details ul li{
    display: inline-block;
    padding: 0px 5px;
    color: #ffffff;
}

.wrapper-main{
    position: relative;
    overflow: hidden;
}
.pad-50{padding: 100px;text-align: justify;}
.pad-15{margin-bottom:15px}
.pipe{width: 30px;position: relative;top: 0;margin-top: -12px;}
.pipe-title {font-size: 20px;color: var(--bs-rouge-pro);text-align: left;padding: 20px;}
.full{width: 100%;}
.forPhone{display: none;}
.forPC{display: block;}
.favicon{height: 40px;}

.sous-navbar{ 
            color: black;
            background: #f9f9f9f9;             
             height: 30px;
             padding-left: 15px ;
             border-bottom: 3px solid var(--bs-rouge-pro);  }
.cacher{display: none;}
.fan-triangle{
width: 10px;
height: 0;
border-style: solid;
border-width: 27px 30px 0 0;
border-color: var(--bs-vert-pro) transparent transparent transparent;
border-bottom: 3px solid var(--bs-rouge-pro);
}
#pages-banniere{background-image: url('https://propme.cm/asset/images/banniere.jpg');
background-position: center;


background-repeat: no-repeat;
padding-top:1px ;
    position: relative;
    height: 300px;

}
.caroussel-T{height: 300px;}
#carouselExampleDark{background-image: url('https://propme.cm/asset/images/banniere.jpg');
background-position: center;


background-repeat: no-repeat;
padding-top:1px ;
    position: relative;
    height: 450px;

}
#carouselExampleDark .carousel-title{
    animation-duration: .9s;
    animation-fill-mode: both;
    animation-name: fadeIn;
    animation-delay: 2s;
float: left;
padding-top: 30px;
margin-left: 10px;
position: relative;

font-weight: bold;
text-decoration: none;
display:  inline-block;
width: 600px;
text-align:center;

}
#carouselExampleDark .carousel-title p{
    width: 400px;
    position: relative;
    right: -100px;

}
#carouselExampleDark label{
    border-bottom: 10px dashed var(--bs-rouge-pro);font-size: 25px;}
#carouselExampleDark p{text-align: justify;padding-left: 10px;}

#carouselExampleDark .myImg{width: 750px;height: 400px;animation-duration: .9s;
    position: relative;
    animation-fill-mode: both;

    animation-name: fadeIn;
    animation-delay: 1s;
top: 0;}
#carouselExampleDark .myImg img{height: 100%;width: auto;float: right;}

/* FORT TELEPHONE */
@media (max-width: 991px){

    #carouselExampleDark .myImg{width: 50px;height: 100px;}
    #carouselExampleDark .myImg{position: relative;top: 0;right: 0;}
    #carouselExampleDark {height: 200px; text-align: left;margin: 0;}
    #carouselExampleDark .carousel-title p{
        position:relative;margin-left: 1px;right: 0;width: auto;margin-left: 10px;}
    #carouselExampleDark .carousel-title{position:relative ;
        float: left;width: 80%;padding-top: 50px;margin: 0;background: var(--bs-vert-pro);padding: 15px;
        color: white;font-family: time new roman;
        height: 200px;
}
#carouselExampleDark label{border-bottom: 2px dashed var(--bs-rouge-pro);font-size: 12px;}
#carouselExampleDark  .carousel-indicators{display: none;}
    }
.popup{background: white;
       width: 1000px;
       height: auto;
       box-shadow: 100% 100% blue;
       border: 5px solid var(--bs-rouge-pro);
       border-radius:50px 0 50px 0;
       z-index: 99999;
       position: relative;
       text-align: justify;
       
       visibility: hidden;
       justify-content: center;                     
       align-items: center;
   }
   .popup-hidden{
    position: fixed;
    left: -10000px;
   }
.popup .log{align-items: center;}
.popup  h6{text-align: center;color: black;}
.bnTop{width: 100%;border-radius:50px 0 0 0;padding-left: 0;padding-right: 0;border-bottom: 1px solid var(--bs-vert-pro);}
.bnBottom{width: 100%;border-radius:0 0 50px 0;padding-left: 0;padding-right: 0;border-top: 3px solid var(--bs-vert-pro);}
.ingtest{animation: defile 3s infinite;}
@keyframes defile {
    from {transform: translate(0px);transition: 2s ease-in-out;}
    to {transform: translate(2px);
    transition: 2s ease-in-out;}
    }


.port-popup{    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    margin-top :15vh;
   }
.page{filter: blur(15px)}
.scroll-top{/* Valeurs avec un mot-clé */
scroll-behavior: auto;
scroll-behavior: smooth;

/* Valeurs globales */
scroll-behavior: inherit;
scroll-behavior: initial;
scroll-behavior: revert;
scroll-behavior: unset;
visibility: hidden;
}
.design_popup{
    position: absolute;
    display: none;
    top: 50%;
    left: 50%;
    z-index: 8888;
    width: 1500px;
    left:0;
    right: 0;
    background: var(--bs-rouge-pro);
    height: 200px;
    transform: matrix(5, 5, 3, 4, 10, 6);;
}
.actua{
    height: 530px;
    width: 100%;
        display: flex;
    justify-content: center;
    align-items: center;
    background: white;

    
}
.actua .ima{
    height: auto;
    border-radius: 10px;
}
.actua video{
    height: 530px;
    background: url('https://propme.cm/asset/images/footer-bg.png');;
}
.actua texte{    display: flex;
    justify-content: center;
    align-items: center;}