@media (max-width: 399px){
        header.d-flex, header a{
            display: block !important;
            text-align: center;
            max-width: 190px;
            margin: 0 auto;

        }
        #logo{
            margin-bottom: 25px  !important; 
        }

}
@media (min-width: 400px){
    #top_title p {
      font-size: 20px;
      padding-left: 25vw;
    }
    #top_right{
        margin-top: 38vw;
    }
}

@media (min-width: 576px){
    #top_title {
      padding-bottom: 24vw;
      margin: 0 20px;
    }
    #top_title h1 {
      font-size: 40px;
    }
    #top_title p {
      font-size: 23px;
      padding-left: 30vw;
      text-align: left;
    }
    #poule_polaroid{
        top: 130px;
        width: 70vw;
    }
    #top_right{
        width: 75%;
        margin-top:25vw;
    }
    #history{
        font-size: 24px;
    }
    #description {
        font-size: 19px;
        line-height: 26px;
    }
    #qui_recoit_donne  #picto{
        width: 25%;
    }
    .bg-wrapper{
        min-height: 500px;
    }

    #aissatou_ba{
        font-size: 18px;
    }
    #aissatou_ba h4{
        font-size: 24px;
    }
}

@media (min-width: 768px){
    #top_title {
        margin: 0 30px;
        padding-bottom: 24vw;
    }
    #top_title p {
      font-size: 25px;
      padding-top: 20px;
      padding-left: 28vw;
      text-align: left;
    }
    #poule_polaroid{
        width: 60vw;
    }
    #top_right{
        width: 55%;
        margin-top:25vw;
    }
    #qui_recoit_donne h3{
        font-size: 34px;
    }

    #qui_recoit_donne  #picto{
        width: 20%;
    }
    .bg-wrapper{
        min-height: 600px;
    }
    #aissatou_ba{
        font-size: 20px;
    }
    #aissatou_ba h4{
        font-size: 28px;
    }
}

@media (max-width: 991px){
    .btn-default{
        font-size: 14px;
        padding: 10px;
    }
    #logo{
        max-width: 190px;
        margin:0 auto 15px;
    }
    header{
        padding: 10px 0 10px;
    }
    .btn{
        padding:8px 16px !important;
        border-radius: 10px;
    }
    #top_title{
        border-radius: 30px 30px 30px 0;
    }
}

@media (min-width: 992px) {

    main{
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom: 100px;
    }
    #top > div{
        display: flex;
    }
    #top_left{
        position: relative;
        background: top left url('../img/top_L_bg.png') no-repeat;
        min-height: 715px;
        width: calc(100% - 374px);
    }

    #top_title{
        background-color: #058036;
        color: #fff;
        min-height: 400px;
        padding : 40px 5% 50px 38%;
        margin: 0 0 0 40px;
    }
    #top_title h1 {
      font-size: 36px;
    }

    #top_title p {
      text-align: left;
      padding-left: 0;
      padding-top: 15px;
      font-size: 20px;
    }
    #poule_polaroid{
        width: 90%;
        left:-7%;
        top:75px;
    } 

    #top_right{
        content: '';
        display: block;
        background: top left url('../img/top_R_bg.png') no-repeat;
        margin-top: 0;
        width: 374px;
    }

    #form_container{
        padding-bottom: 60px;
        padding-right: 60px;
    }
    #form_container .form_header h2{
        font-size: 26px;
        line-height: 30px; 
    }
    #form_container .form_header span{
        font-size: 22px;
        line-height: 26px; 
    }
    #history{
        font-size: 26px;
        line-height: 30px; 
    }

    #qui_recoit_donne h2{
        font-size: 46px;
    }
    #qui_recoit_donne h3{
        font-size: 36px;
    }
    #qui_recoit_donne p{
        font-size: 22px;
        line-height: 28px;
    }
    #qui_recoit_donne img.half_rounded{
        border-radius: 0 20px 20px 0 ;
    }
    #qui_recoit_donne #picto_container.p-lg-5{
        padding: 3rem 2rem !important;
    }
    .bg-wrapper{
        min-height: auto;
    }


    #aissatou_ba .top > div, #aissatou_ba .bottom > div, #don_en_confiance, .footer_bottom{
        width: 70%;
        margin: 0 auto;
    }

}

@media (min-width: 1200px) {
    main{
        padding-left: 100px !important;
        padding-right: 70px !important;
    }
   #top_title{
        padding : 40px 10% 50px 25%;
        min-height: 300px;
   }

    #top_title h1{
        font-size: 40px;
    }
    #top_title p{
        font-size: 22px;
    }

    #poule_polaroid{
        top: 50px;
        width: 90%;
        left:-20%;
    }
    #description {
      font-size: 22px;
      line-height: 28px;
    }


    #qui_recoit_donne h2{
        font-size: 44px;
    }  




    #aissatou_ba .top > div, #aissatou_ba .bottom > div, #don_en_confiance, .footer_bottom{
        width: 60%;
        margin: 0 auto;
    }

}

@media (min-width: 1400px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    max-width: 1320px;
  }

     #top_title{
        min-height: 410px;
   }
    #top_title h1{
        font-size: 50px;
    }
    #top_title p{
        font-size: 27px;
    }


    #poule_polaroid{
        width: 85%;
        left:-20%;
    }


    #qui_recoit_donne h2{
        font-size: 46px;
    }
    #aissatou_ba .top > div, #aissatou_ba .bottom > div, #don_en_confiance, .footer_bottom{
        width: 55%;
        margin: 0 auto;
    }


}