:root {
    --primary: #051E7A;
    --secondary: #ccc;
    --danger: #AD0216;
    --light:#FFFFFF;
    --blue:#051E7A;
    --gris:gray;
    --black:rgb(0, 0, 0);
}

a{
    color: var(--danger);
}

/* @media screen and (min-width: 100px) and (max-width: 336px){ */
/* @media only screen and (max-width: 336px) {
    #card_pack_pro {
        width: 320px;
        margin-bottom: 10px;
        margin-left: 10px;
        margin-top: 10px;
    }
} */

/* @media only screen and (max-width: 336px) { */
@media only screen and (min-width: 100px) and (max-width: 336px) {
    /* @media screen and (min-width: 100px) and (max-width: 765px){ */
    .navbar-brand #logo_sf {width: 100px;}
    
    nav.navbar {
        background: #eaeaea!important;
        color: var(--primary);
        padding: 0px;
        margin-bottom: 5px;
    }
    
    #menu_mobile{
        color: var(--light);
    }
    .navbar-toggler{
        background: var(--danger);
    }
    #goToTop{
        display: none!important;
    }

    #goToTop img{
        display: none!important;
    }
    /* #wa-widget-send-button {
        margin: 0px !important;
        padding-left: 0px;
        padding-right: 0px;
        position: fixed !important;
        z-index: 16000160 !important;
        bottom: 0 !important;
        text-align: center !important;
        height: 50px;
        min-width: 50px;
        border-radius: 25px;
        visibility: visible;
        transition: none !important;
        background-color: #4dc247;
        box-shadow: 2px 2px 6px rgba(0,0,0,0.4);
        right: 40px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    } */
    #contacts{
        /* width: 100%; */
        padding: 0px!important;
        color: var(--blue)!important;
    }
    
    #contacts h4{
        color: var(--blue)!important;
        /* margin-bottom: 10px; */
        font-size: 20px;
    }

    #newsletter1 {
        padding: 10px;
        width: 100%;
        display: inline-block;
    }

    .navbar-toggler:hover{
        background: var(--primary);
    }
    #container_1{
        padding-top: 0px;
        padding-bottom: 0px;
    }
    #container_1 .row .col-md-4{
    width: 100%;
    padding-top: -10px;
    padding-top: 5px;
    margin: 0px;
    }
    
    a div #btn_sous_menu{
        font-weight: bold;
        padding-top: 0px;
        padding-bottom: 0px;
        margin-left: 2px;
        margin-right: 2px;
        font-size: 10px;
        background: var(--primary)!important;
    }
    #cibles_titles{
        margin-top: -20px;
        color: var(--danger)!important;
    }
    
    #cibles_titles_p{
    text-align: center;
    margin: 0px;
    padding: 0px;
    }
    div.container div.px-4.py-5.my-5{
        border-radius: 10px;
        background-color: var(--secondary);
        margin-bottom: 10px!important;
        margin-top: 10px!important;
    }
    .py-5 {
        padding-top: 0px!important;
        padding-bottom: 0px!important;
    }
    .px-4 {
        padding-right: 0px!important;
        padding-left: 0px!important;
    }
    .my-5 {
        margin-top: 0px!important;
        margin-bottom: 0px!important;
    }
    
    div.container {
        width: 100%;
        /* padding-top: 5px; */
        padding-left: 1px;
        padding-right: 1px;
    }
    .carousel-control-next-icon, .carousel-control-prev-icon{display: none!important;}
    /* #Clientcontainer_1{
        margin-bottom: -100px;
    } */
    #ctn_img_pro img{
        width: 100%;
    }
    
    .card{
        width: 100%;
    }
    #card_pack_pro .card .card-body{
        padding: 5px;
    }
    #card_pack_pro .card .card-title{
        font-size: 15px;
        font-weight: bold;
    }
    #card_pack_pro{
        /* width: 50%; */
        width: 320px;
        /* height: 200px; */
        /* border-radius: 10px; */
        margin-bottom: 10px;
        margin-left: 10px;
        margin-top: 10px;
    }
    #img_pro {
        /* width: 100%; */
        max-height: 170px;
        /* height: 100px; */
        object-fit: cover;
    }
    
    #pack_single {
        width: 45%;
        background: var(--light) 0% 0% no-repeat padding-box;
        box-shadow: 0px 6px 18px #00000029;
        border-radius: 20px;
        opacity: 1;
        padding: 0px;
        /* margin: 10px; */
        /* margin: auto; */
    }
    #pack_single #pack_body{
    display: none;
    }
    div#contenair_img_pack{
        text-align: center;
    }
    img#img_products{
        /* text-align: center; */
        width: 70%!important;
    }
    #pack{
        background: rgb(255, 255, 255)!important;
        padding: 20px!important;
    }
    #pack_single .bouton_pack {
        float: none!important;
        text-align: left;
        background: #c1c1c1;
        font-size: 10px;
        letter-spacing: 0px;
        color: #707070;
        opacity: 1;
        padding: 0px;
        border-radius: 10px;
    }
    
    #pack_single .bouton_pack:hover{
        text-align: left;
        background: var(--danger);
        font-size: 10px;
        letter-spacing: 0px;
        color: var(--light);
        font-weight: bold;
        opacity: 1;
        padding: 0px;
        border-radius: 10px;
    }
    
    a#pack_title{
        font-size: 15px;
    }
    
    
    }



@media screen and (min-width: 337px) and (max-width: 767px){
span.carousel-control-next-icon, span.carousel-control-prev-icon{display: none!important;}
.navbar-brand #logo_sf {width: 100px;}
nav.navbar {
    background: #eaeaea!important;
    color: var(--primary);
    padding: 0px;
    margin-bottom: 5px;
}

#goToTop{
    display: none!important;
}

#goToTop img{
    display: none!important;
}

/* #wa-widget-send-button {
    margin: 0px !important;
    padding-left: 0px;
    padding-right: 0px;
    position: fixed !important;
    z-index: 16000160 !important;
    bottom: 0 !important;
    text-align: center !important;
    height: 50px;
    min-width: 50px;
    border-radius: 25px;
    visibility: visible;
    transition: none !important;
    background-color: #4dc247;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.4);
    right: 40px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
} */

#contacts{
    /* width: 100%; */
    padding: 0px!important;
    color: var(--blue)!important;
}

#contacts h4{
    color: var(--blue)!important;
    /* margin-bottom: 10px; */
    font-size: 20px;
}

#newsletter1 {
    padding: 10px;
    width: 100%;
    display: inline-block;
}

#menu_mobile{
    color: var(--light);
}
.navbar-toggler{
    background: var(--danger);
}

.navbar-toggler:hover{
    background: var(--primary);
}
#navbarColor01 {
    margin-left: 0px!important;
}
#container_1{
    padding-top: 0px;
    padding-bottom: 0px;
}
#container_1 .row .col-md-4{
width: 33%;
padding-top: -10px;
padding-top: 5px;
margin: 0px;
}

#comptes_menu{
    width: 50%;
    margin-top: 2px;
    margin-bottom: 2px;
}

 a div #btn_sous_menu{
    font-weight: bold;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-left: 2px;
    margin-right: 2px;
    font-size: 10px;
    background: var(--primary)!important;
}

.card{
    margin-bottom: 10px;
}
    #card_pack_pro {
        width: 100%;
        margin-bottom: 10px;
        margin-left: 5px;
        margin-right: 5px;
        margin-top: 10px;
    }

    .card{
        width: 96%;
    }
    #card_pack_pro .card .card-body{
        padding: 5px;
    }
    #card_pack_pro .card .card-title{
        font-size: 15px;
        font-weight: bold;
    }
    #img_pro {
        width: 100%;
        /* max-height: 280px; */
        /* height: 100px; */
        object-fit: cover;
    }

    #cibles_titles{
        margin-top: -20px;
        color: var(--danger)!important;
    }
    
    #cibles_titles_p{
    text-align: center;
    margin: 0px;
    padding: 0px;
    }
    div.container div.px-4.py-5.my-5{
        border-radius: 10px;
        margin-bottom: 10px!important;
        margin-top: 10px!important;
    }
    .py-5 {
        padding-top: 0px!important;
        padding-bottom: 0px!important;
    }
    .px-4 {
        padding-right: 0px!important;
        padding-left: 0px!important;
    }
    .my-5 {
        margin-top: 0px!important;
        margin-bottom: 0px!important;
    }
    
    div.container {
        width: 100%;
        padding-top: 5px;
        padding-left: 1px;
        padding-right: 1px;
    }


    #pack_single {
        width: 45%;
        background: var(--light) 0% 0% no-repeat padding-box;
        box-shadow: 0px 6px 18px #00000029;
        border-radius: 20px;
        opacity: 1;
        padding: 0px;
        /* margin: 10px; */
        /* margin: auto; */
    }
    #pack_single #pack_body{
    display: none;
    }
    div#contenair_img_pack{
        text-align: center;
    }
    img#img_products{
        /* text-align: center; */
        width: 70%!important;
    }
    #pack{
        background: rgb(255, 255, 255)!important;
        padding: 20px!important;
    }
    #pack_single .bouton_pack {
        float: none!important;
        text-align: left;
        background: #c1c1c1;
        font-size: 10px;
        letter-spacing: 0px;
        color: #707070;
        opacity: 1;
        padding: 4px;
        border-radius: 10px;
    }
    
    #pack_single .bouton_pack:hover{
        text-align: left;
        background: var(--danger);
        font-size: 10px;
        letter-spacing: 0px;
        color: var(--light);
        font-weight: bold;
        opacity: 1;
        padding: 4px;
        border-radius: 10px;
    }
    
    a#pack_title{
        font-size: 20px;
        font-weight: bold;
    }

    #title_apps {
        margin-top: 3px!important;
        margin-bottom: 20px!important;
    }
    #apps{
        text-align: center;
        padding-top: 5px;
        padding-left: 5px;
        padding-right: 5px;
        padding-bottom: 25px;
    }

    #footer .container{
        padding: 10px;
    }
    #pack_singles_Z, #pack_singles_S, #pack_singles_D{
        width: 60%!important;
    }
    #pack_singles_Zi, #pack_singles_Sa, #pack_singles_Di{
        margin-bottom: 20px!important;
    }
    #pack_img_menu {
        width: 20px!important;
    }

    #btn_sous_menu img{
        text-align: center;
        color: var(--light)!important;
    }
    #btn_sous_menu{
        text-align: center;
        color: var(--light)!important;
    }
    i.bi.bi-check-circle-fill{
        color: var(--gris);
    }

    h5.display-5.fw-bold{
        box-shadow: 0px 6px 18px #00000029;
    }
    .container-fluid.py-5{
        text-align: center!important;
        margin: 0px;
        padding: 0px;
    }
}


@media screen and (min-width: 768px) and (max-width: 991px){
    span.carousel-control-next-icon, span.carousel-control-prev-icon{display: none!important;}
    .navbar-brand #logo_sf {width: 100px;}
    nav.navbar {
        background: #eaeaea!important;
        color: var(--primary);
        padding: 0px;
        margin-bottom: 5px;
    }
    
    #goToTop{
        display: none!important;
    }

    #goToTop img{
        display: none!important;
    }
    /* #wa-widget-send-button {
        margin: 0px !important;
        padding-left: 0px;
        padding-right: 0px;
        position: fixed !important;
        z-index: 16000160 !important;
        bottom: 0 !important;
        text-align: center !important;
        height: 50px;
        min-width: 50px;
        border-radius: 25px;
        visibility: visible;
        transition: none !important;
        background-color: #4dc247;
        box-shadow: 2px 2px 6px rgba(0,0,0,0.4);
        right: 40px;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
    } */

    #contacts{
        /* width: 100%; */
        padding: 0px!important;
        color: var(--blue)!important;
    }
    
    #contacts h4{
        color: var(--blue)!important;
        /* margin-bottom: 10px; */
        font-size: 20px;
    }

    #newsletter1 {
        padding: 10px;
        width: 100%;
        display: inline-block;
    }

    #menu_mobile{
        color: var(--light);
    }
    .navbar-toggler{
        background: var(--danger);
    }
    
    .navbar-toggler:hover{
        background: var(--primary);
    }
    #navbarColor01 {
        margin-left: 0px!important;
    }
    #container_1{
        padding-top: 0px;
        padding-bottom: 0px;
    }
    #container_1 .row .col-md-4{
    width: 33%;
    padding-top: -10px;
    padding-top: 5px;
    margin: 0px;
    }
    
    #comptes_menu{
        width: 50%;
        margin-top: 2px;
        margin-bottom: 2px;
    }
    
     a div #btn_sous_menu{
        font-weight: bold;
        padding-top: 2px;
        padding-bottom: 2px;
        margin-left: 2px;
        margin-right: 2px;
        font-size: 10px;
        background: var(--primary)!important;
    }
    
    .card{
        margin-bottom: 10px;
    }
        #card_pack_pro {
            width: 44%;
            margin: auto;
            /* margin-bottom: 10px;
            margin-left: 5px;
            margin-right: 5px;
            margin-top: 10px; */
        }
    
        #content_apropos{
            margin-top: 0px!important;
        }

        #img_simulateur{
            display: none;
        }

        #content_simulateur{
            width: 100%;
        }
        .card{
            width: 96%;
        }
        #card_pack_pro .card .card-body{
            padding: 5px;
        }
        #card_pack_pro .card .card-title{
            font-size: 15px;
            font-weight: bold;
        }
        #img_pro {
            width: 100%;
            /* max-height: 280px; */
            /* height: 100px; */
            object-fit: cover;
        }
    
        #cibles_titles{
            margin-top: -20px;
            color: var(--danger)!important;
        }
        
        #cibles_titles_p{
        text-align: center;
        margin: 0px;
        padding: 0px;
        }
        div.container div.px-4.py-5.my-5{
            border-radius: 10px;
            margin-bottom: 10px!important;
            margin-top: 10px!important;
        }
        .py-5 {
            padding-top: 0px!important;
            padding-bottom: 0px!important;
        }
        .px-4 {
            padding-right: 0px!important;
            padding-left: 0px!important;
        }
        .my-5 {
            margin-top: 0px!important;
            margin-bottom: 0px!important;
        }
        
        div.container {
            width: 100%;
            padding-top: 5px;
            padding-left: 1px;
            padding-right: 1px;
        }
    
    
        #pack_single {
            width: 45%;
            background: var(--light) 0% 0% no-repeat padding-box;
            box-shadow: 0px 6px 18px #00000029;
            border-radius: 20px;
            opacity: 1;
            padding: 0px;
            /* margin: 10px; */
            /* margin: auto; */
        }
        #pack_single #pack_body{
        display: none;
        }
        div#contenair_img_pack{
            text-align: center;
        }
        img#img_products{
            /* text-align: center; */
            width: 70%!important;
        }
        #pack{
            background: rgb(255, 255, 255)!important;
            padding: 20px!important;
        }
        #pack_single .bouton_pack {
            float: none!important;
            text-align: left;
            background: #c1c1c1;
            font-size: 10px;
            letter-spacing: 0px;
            color: #707070;
            opacity: 1;
            padding: 4px;
            border-radius: 10px;
        }
        
        #pack_single .bouton_pack:hover{
            text-align: left;
            background: var(--danger);
            font-size: 10px;
            letter-spacing: 0px;
            color: var(--light);
            font-weight: bold;
            opacity: 1;
            padding: 4px;
            border-radius: 10px;
        }
        
        a#pack_title{
            font-size: 20px;
            font-weight: bold;
        }
    
        #title_apps {
            margin-top: 3px!important;
            margin-bottom: 20px!important;
        }
        #apps{
            text-align: center;
            padding-top: 5px;
            padding-left: 5px;
            padding-right: 5px;
            padding-bottom: 25px;
        }
    
        #footer .container{
            padding: 10px;
        }
        #pack_singles_Z, #pack_singles_S, #pack_singles_D{
            width: 60%!important;
        }
        #pack_singles_Zi, #pack_singles_Sa, #pack_singles_Di{
            margin-bottom: 20px!important;
        }
        #pack_img_menu {
            width: 20px!important;
        }
    
        #btn_sous_menu img{
            text-align: center;
            color: var(--light)!important;
        }
        #btn_sous_menu{
            text-align: center;
            color: var(--light)!important;
        }
        i.bi.bi-check-circle-fill{
            color: var(--gris);
        }
    
        h5.display-5.fw-bold{
            box-shadow: 0px 6px 18px #00000029;
        }
        .container-fluid.py-5{
            text-align: center!important;
            margin: 0px;
            padding: 0px;
        }
    }

h3#dat_title{
    text-align:center; 
    background:var(--danger)!important;
    color: var(--light);
    padding: 5px;
    margin-bottom: 10px;
}
/* .text-danger{
color: var(--danger)!important;
} */
p#dat_corps{
    font-size: 16px;
}
#dat_en_tete td{
    background: var(--primary)!important;
    color: var(--light);
    border: 1px solid #ccc;
}
.form-range::-webkit-slider-runnable-track {
    width: 100%;
    height: 0.5rem;
    color: transparent;
    cursor: pointer;
    mask-size: 100px;
    /* background-color: #000b52; */
    border-color: transparent;
    border-radius: 1rem;
  }
.custom-range::-webkit-slider-thumb {
    background: var(--danger)!important;
    font-size: 30px;
  }
  
  .custom-range::-moz-range-thumb {
    background: var(--danger)!important;
    font-size: 30px;

  }
  
  .custom-range::-ms-thumb {
    background: var(--danger)!important;
    font-size: 30px;

  }

#tbody td{
    border: 1px solid #ccc;
}

img#img_products{
    width: 70%;
}
#content_apropos{
    margin-top: 100px;
}

#logo_sf {width: 200px;}

#produits_avances_content{
    margin-bottom: 10px;
    margin-top: 10px;
}
h1#titles_produits_avances{
    text-align: center;
    background: var(--gris);
    color: var(--light);
    border-radius: 10px;
    padding: 5px;
}

#produits_avances_en{
    border-right: 1px solid var(--gris);
}
#produits_avances_par{
    border-left: 1px solid var(--gris);
}

#accordion_title{
    font-size: 20px;
    font-weight: bold;
    border: 2px solid var(--secondary);
    border-radius: 10px;
    margin-bottom: 10px;
}
#bouton_accordion{
    /* float: right; */
    background-color: var(--primary)!important;
    padding: 7px;
}
#accordion_body{
    background: var(--secondary);
    padding: 50px!important;
    margin-bottom: 50px;
}

i.bi.bi-check-circle-fill{
    color: var(--gris);
}

#download{
    border: 0px;
    background: var(--danger)!important;
}

#download:hover{
    border: 0px;
    background: var(--primary)!important;
}

#contacts .bi.bi-whatsapp,
#contacts .bi.bi-envelope,
#contacts .bi.bi-telephone,
#contacts .bi.bi-geo-alt{
    color: var(--danger)!important;
    padding: 10px;
}

#title_contacts{
    color: var(--danger);
    /* background: var(--light); */
}

#contacts{
    /* width: 100%; */
    padding: 60px;
    color: var(--blue)!important;
}

#contacts h4{
    color: var(--blue)!important;
    /* margin-bottom: 10px; */
    font-size: 25px;
}

#contacts h4 a{
    color: var(--blue)!important;
}

/* #contacts:hover{
     background: var(--light); 
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;

} */

#infos_maps{
    padding: 10px;
    background: var(--light);
    border-radius: 10px;
    /* box-shadow: rgba(255, 255, 255, 0.2) 0px 2px 8px 0px; */
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
#btn_newsletter{
    background: var(--primary)!important;
    padding: 10px!important;
    display: inline-block;
    border: 0px;
    font-weight: bold;
  }


  #btn_newsletter:hover{
    background: var(--secondary)!important;
    color: var(--blue);
    padding: 10px!important;
    display: inline-block;
    border: 0px;
    font-weight: bold;
  }

  

  
/* ----------------------------------------------MENU----------------------------------- */

nav.navbar{
    background: #eaeaea!important;
    color: var(--primary);
    margin-bottom: 5px;
}
.container-fluid a{
    color: var(--primary);
}

.nav-link{
    color: var(--primary);
}

.nav-link:hover{
    color: var(--danger);
}

.container-fluid a:hover{
    color: var(--danger);
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
    color: var(--danger);
}

#btn_menu_top{
  border-radius: 5px;
  color: var(--light)!important;
  background: var(--primary)!important;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 15px;
  padding-right: 15px;
  margin: 5px;
}

#btn_menu_top:hover{
  border-radius: 5px;
  color: var(--light)!important;
  background: var(--danger)!important;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 15px;
  padding-right: 15px;
  margin: 5px;
}

#access:hover{
  background: var(--primary)!important;
}
#access{
  background: var(--danger)!important;
}

#navbarColor01{
  margin-left: 50px;
}

/* ----------------------------------------------SIMULATEUR----------------------------------- */

#title_simulateur{
    /* background: var(--secondary); */
    color:var(--danger); 
    padding: 10px; 
    text-align:center;
}
/* ----------------------------------------------MENU_BOTTOM----------------------------------- */

#title_1{
    margin-top: 10px;
}
#container_1{
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
a{
    text-decoration: none;
}

#btn_sous_menu{
  font-weight: bold;
  padding-top: 6px!important;
  padding-bottom: 6px!important;
  background: var(--primary)!important;
}

#btn_sous_menu:hover{
  background: var(--danger)!important;
}
/* ---------------------------------------PRODUITS------------------------------------------ */

#pack_body{
    text-align: left;
    font: normal normal normal 16px/25px Avenir Next LT Pro;
    /* font-size: 15px!important; */
    letter-spacing: 0px;
    color: #031247;
    opacity: 1;
}
#pack{
    /*margin-top: 2px;
    padding: 10px;*/
    /* background: rgb(255, 255, 255)!important; */
    /*padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;*/
    padding: 30px;
}
#pack_single{
    background: var(--light) 0% 0% no-repeat padding-box;
    box-shadow: 0px 6px 18px #00000029;
    border-radius: 30px;
    opacity: 1;
    padding: 20px;
    margin: 10px;
    margin: auto;
}
#pack_title{
    text-align: left;
    font: normal normal normal 30px/41px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: var(--danger);
    opacity: 1;
}

#pack_singles_E{
/*                    background: #FFFFFF 0% 0% no-repeat padding-box;*/
    background: #ECCCCB 0% 0% no-repeat padding-box;
    box-shadow: 0px 6px 18px #00000029;
    border-radius: 30px;
    opacity: 1;
    margin: 2px;
    margin: auto;
    padding: 5px;
    text-align: center;
}

#pack_singles_Z{
    /* background: #FFEDE8 0% 0% no-repeat padding-box; */
    /* box-shadow: 0px 6px 18px #00000029; */
    border-radius: 30px;
    opacity: 1;
    margin: 2px;
    margin: auto;
    padding: 5px;
    text-align: center;
    width: 70%;
}


#pack_singles_S{
    /* background: #FFF0CF 0% 0% no-repeat padding-box; */
    /* box-shadow: 0px 6px 18px #00000029; */
    border-radius: 30px;
    opacity: 1;
    margin: 2px;
    margin: auto;
    padding: 5px;
    text-align: center;
    width: 70%;
}


#pack_singles_D{
    /* background: #D9F3FF 0% 0% no-repeat padding-box; */
    /* box-shadow: 0px 6px 18px #00000029; */
    border-radius: 30px;
    opacity: 1;
    margin: 2px;
    margin: auto;
    padding: 5px;
    text-align: center;
    width: 70%;

}

#pack_singles_Et{
/*                    background: #FFFFFF 0% 0% no-repeat padding-box;*/
/*                    box-shadow: 0px 6px 18px #00000029;*/
    opacity: 1;
    margin: 2px;
    margin: auto;
    /* padding: 5px;*/
    text-align: center;
}

#pack_singles_Zi{
/*                    background: #FFFFFF 0% 0% no-repeat padding-box;*/
/*                    box-shadow: 0px 6px 18px #00000029;*/
    opacity: 1;
    margin: 2px;
    margin: auto;
    /* padding: 5px;*/
    text-align: center;
}


#pack_singles_Sa{
/*                    background: #FFFFFF 0% 0% no-repeat padding-box;*/
/*                    box-shadow: 0px 6px 18px #00000029;*/
    opacity: 1;
    margin: 2px;
    margin: auto;
    /* padding: 5px;*/
    text-align: center;
}


#pack_singles_Di{
    /*   background: #FFFFFF 0% 0% no-repeat padding-box;*/
    /*   box-shadow: 0px 6px 18px #00000029;*/
    /*   border-radius: 30px;*/
    opacity: 1;
    margin: 2px;
    margin: auto;
    /* padding: 5px;*/
    text-align: center;
}

#pack_img{
    width: 80%;
}

#pack_titles{
    text-align: center;
    font: normal normal normal 25px/35px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: var(--primary);
    text-transform: uppercase;
    opacity: 1;
    font-weight: bold;
}

.bouton_pack_Et{
    text-align: left;
    background: #c1c1c1;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}

.bouton_pack_Sa{
    text-align: left;
    background: #c1c1c1;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}

.bouton_pack_Zi{
    text-align: left;
    background: #c1c1c1;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}


.bouton_pack{
    text-align: left;
    background: #c1c1c1;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
    
    /*width: 29%;
    margin: auto;*/
}
.bouton_pack:hover #chevron_1 {display:none;}
.bouton_pack:hover #chevron_2 {display:initial}

#chevron_2 {display:none;}

.bouton_pack:hover{
    background: var(--primary) 0% 0% no-repeat padding-box;
    text-align: left;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: #fff;
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}

.bouton_pack_Di{
    text-align: left;
    background: #c1c1c1;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: #707070;
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}

.bouton_pack_Et:hover{
    background: #ECCCCB 0% 0% no-repeat padding-box;
    text-align: left;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: var(--primary);
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}

.bouton_pack_Sa:hover{
    background: var(--primary) 0% 0% no-repeat padding-box;
    text-align: left;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: var(--light);
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}


.bouton_pack_Zi:hover{
    background: var(--primary) 0% 0% no-repeat padding-box;
    text-align: left;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: var(--light);
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}

.bouton_pack_Di:hover{
    background: var(--primary) 0% 0% no-repeat padding-box;
    text-align: left;
    font: normal normal normal 15px/20px Avenir Next LT Pro;
    letter-spacing: 0px;
    color: var(--light);
    opacity: 1;
    padding: 10px;
    border-radius: 10px;
}

.bi-chevron-right{
    background: var(--light);
    color: #707070;
    border-radius: 50%;
    padding: 3px;
}

.bg1 {
        background: url(assets/images/bg/testimonial-bg.png);
        /* url(assets/images/bg/fintech-bg6.png) */
        background:linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(0,112,255,1) 0%, rgba(142,171,245,1) 0%, rgba(22,24,114,1) 62%, rgba(0,2,50,1) 100%);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        /* background-color: #ae0117; */
    }

    /*#scroll{
        background: red!important;
    }*/

    #scrollUp i {
        background-image: linear-gradient(90deg, #ff0018 0%, #3f3f3f 100%);
        border-radius: 50%;
        height: 40px;
        font-size: 24px;
        font-weight: 600;
        width: 42px;
        color: #fff;
        line-height: 36px;
        transition: all 0.3s ease;
        margin-left: 2px;
        box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.4);
    }

/*.bi-chevron-right:hover{
    background: white;
    color: red;
    border-radius: 50%;
    padding: 3px;
}*/
/* ------------------------------------------------------------------------------------ */


#title_apps{
    margin-top: 150px;
    margin-bottom: 20px;
}

#title_apps b.sm{
    color: var(--primary);
}

#title_apps b.sf{
    color: var(--danger);
}


#img_apps{
    width: 100%;
}
.btn-part{
    margin-top: 50px;
}
a#partage{
    background: rgb(255, 195, 195)!important;
    color: black;
    font-weight: bold;
    padding: 10px;
    border-radius: 10px;
}
a#partage:hover{
    padding: 10px;
    background: darkgray!important;
    border-radius: 10px;
}
a#partage img{
    width: 22px;
}