@import url('https://fonts.googleapis.com/css2?family=Manrope&display=swap');
.body{
 width: 100%;
}
h1{
font-family: 'Manrope', sans-serif;
}
h2{
    font-family: 'Manrope', sans-serif;
}
h3{
    font-family: 'Manrope', sans-serif;
}
h4{
    font-family: 'Manrope', sans-serif;
}
h5{
    font-family: 'Manrope', sans-serif;
}
h6{
    font-family: 'Manrope', sans-serif;
}
p{
    font-family: 'Manrope', sans-serif;
}
.pm-top {
 padding-left: 70px !important;
 padding-right: 70px !important;
 margin-top: 36px;
}
.pm-top-70 {
    padding-left: 70px !important;
    padding-right: 70px !important;
   }
.pm-10 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}
.pm {
    padding-left: 30px !important;
    padding-right: 30px !important;
   }
.p-b-0{
    padding-bottom: 0px !important;
}
.p-b-c{
    background-color: #fff0;
    border: none;
    padding: 0px;
}
.bg-none{
    background: #0000 !important;
}
.w-100{
    width: 100% !important;
}
.mr-text{
    margin-right: 3% !important;
}
.mt-mb-5{
    margin-top: 4rem !important;
    margin-bottom: 5rem !important;
}
.w-60{
    width: 60% !important;
}
.mb-6{
    margin-bottom: 6rem !important;
}
.mb-7{
    margin-bottom: 10rem !important;
}
.mt-7{
    margin-top: 4rem !important; 
}
.mt-6{
    margin-top: 6rem !important;
}
.mt-10{
    margin-top: 10rem !important;
}
.mr-6{
    margin-right: 30px !important;
}
.bg-blue{
    background-color: #3405E1;
}
.ml-1{
    margin-left: 40px;
}
.ml-2{
    margin-left: 20px;
}
.ml-4{
    margin-left: 100px;
}
.ft-12{
    font-size: 12px !important;
}
.ft-13{
    font-size: 13px !important;
}
.ft-16{
    font-size: 16px !important;
}
.w-70{
    width: 70% !important;
}
.w-97{
    width: 97% !important;
}
.position-abs{
    position: absolute;
margin-top: -10%;
margin-left: 100px;
}
.h-150{
    height: 150px;
}
.h-130{
    height: 130px; 
}
.btn-black{
    color: var(--bs-btn-hover-color) !important;
background-color: #000 !important;
border-color: #000 !important;
}
.btn-blue{
    color: var(--bs-btn-hover-color) !important;
background-color: #3405E1 !important;
border-color: #3405E1 !important;
}
.btn-white{
    color: var(--bs-btn-hover-color) !important;
background-color: #ffffff !important;
border-color: #ffffff !important;
color: #3405E1 !important;
}
.ml-3{
    margin-left: 20px !important;
}
.img-frame{
    position: absolute !important;
    width: 450px !important;
    margin-left: 10%;
    margin: 39pw;
    margin-top: 50px;
    align-content: center;
    display: flex;
}
.mb-8{
    margin-bottom: 88px;
}
.mb-7-0{
    margin-bottom: 70px !important;
}
.bg-metal-gray{
    background-color: rgba(212, 209, 209, 0.329) !important;
}
.metal-gray-text{
    color: rgb(100, 100, 100) !important;
}
.px-13{
    font-size: 13px !important;
}
a{
    text-decoration: none !important;
    color: rgb(100, 100, 100) !important;
}
.btn-shadow{
        color: var(--bs-btn-hover-bg);
        background-color: #FFF;
        border-color: #D3D3D3;
        box-shadow: rgba(6, 6, 13, 0.3) 6px 4px 7px;
}
.bg-radios{
    border-radius: 25px !important;
}
/*text-color*/
.text-white{
    color:aliceblue !important
}
.text-blue{
    color: #3405E1 !important; 
}
.text-black{
    color: black !important;
}
.w-100{
    width: 100% !important;
}
.b-c-blue{
    border: solid !important;
    border-radius: 30px;
    border-top-color: #3405E1  !important;
    border-bottom-color:#3405E1 !important;
    border-right-color:#3405E1 !important; 
    border-left-color:#3405E1 !important ;
}
.img-frame{
    position: absolute;
    width: 450px !important;
    margin-left: 10%;
}
.bg-ligne{
    background-image: url("img/bg/Bubble-chat.png");
}
.bg-ligne{
    background-size: cover;
    width: 100% !important;
    position: absolute;
    width: 90% !important;
}
.bg-ligne-row{
    height: 645px !important;
}
.accordion-item{

    margin-bottom: 20px !important;
    border-radius:22px !important ;
}
.accordion-button{
    padding: 28px !important;
    border-radius:30px !important ;

}
.accordion-button.collapsed::after{
    background-color: #3405E1;
    color: rgb(233, 233, 233) !important;
    border-radius: 30px;
    background-size: 16px;
    position: unset;
    background-position: center;
}
--bs-accordion-btn-active-icon{
    color: aliceblue !important;
}
button:not(.collapsed)::after{
    border-radius: 30px;
    background-size: 16px;
    position: unset;
    background-position: center;
    background-color: #3405E1;
    background-image: rgb(255, 255, 255) !important;
}
.accordion-button {
    color: black !important;
}
.pink-text{
    color:#F72585 !important;
}
.text-s{
    text-align: start !important;
}
.pos-z-w-abs{
    position: absolute;
z-index: -1;
width: 100% !important;
}
@media screen and (max-width:500px) {
    .img-frame {
        position: absolute;
        width: 450px ;
        margin-left: 10% !important;
    }
}
@media screen and (max-width:600px) {
    .img-frame {
        position: absolute;
        width: 450px ;
        margin-left: 20% ;
    }
    
}
@media screen and (max-width:880px) {
    .w-97{
        width: 100% !important;
    }
    .pm-top-mobile {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
    .nav-link {
        width: 100% !important;
        text-align: end !important;
        margin-bottom: 6px;
    }
    .mobile-100{
        width: 100% !important;
    }
    .mobile-none{
        display: none;
    }
    .ft-size-40{
        font-size: 41px;
    }
    .mt-mb-5{
        margin-top: 1rem !important;
        margin-bottom: 1rem !important;
    }
    .mb-6 {
        margin-bottom: 1rem !important;
    }
    .mt-6 {
        margin-top: 1rem !important;
    }
    .display-g{
        display: grid !important;
    }
    .mobile-mb{
        margin-bottom: 340px;
    }
    .mb-7{
        margin-bottom: 2rem !important;
    }
    .mb-mobile{
        margin-bottom: 100px !important;
    }
    .position-abs {
    position: absolute;
    margin-top: 17%;
    margin-left: 50px;
    width: 80%;
    margin-right: 50px;
    }
    .mt-10 {
	margin-top: 15rem !important;
    }
    .mt-9{
        margin-top: 20px !important;
    }
    .text-s-mobile{
        text-align: start !important;
    }
    .ft-z-17{
        font-size: 17px !important;
    }
    .img-frame {
        position: absolute;
        width: 315px !important;
        margin-left: 29% ;
        margin-top: 0px;
    }
    .w-70-mobile{
        width: 70% !important;
    }
    .w-30-mobile{
        width: 30% !important;
    }
    .w-40-mobile{
        width: 40% !important;
    }
    .w-60-mobile{
        width: 60% !important;
    }
    .p-x{
        padding: 0% !important;
    }
}
@media screen and (min-width:880px) {
    .img-frame {
        position: absolute;
        width: 450px !important;
        margin-left: 10% ;
    }
}
@media screen and (min-width:1330px) {
    .img-frame {
        position: absolute;
        width: 463px !important;
        margin-left: 10%;
        margin-top: 0px;
    }
}