/* Media queries will live here.  */
/* has to be responsive */
/* this will give good practice on working with media queries and building responsive layouts.*/
/* use this a learning oppurtunity to improve skills. */
/* added media queries  */





@media screen and (max-width:528px){

.Titlea{

font-size: 20px;

}


#Hero-Titles{
  font-size: 2.5em;
}

.Join-btn{
  font-size: 2EM;
  text-align: center;
}
.Join-Title-Banner{
  width: auto;
  line-height: 1.6em;
  padding: 20px;
  letter-spacing: 0.62px;
  font-weight: 220;
  margin-bottom: 1.2em;
  }
  .donnabw{
    width: 250px;
    height: 250px;
    margin-top: 3.4em;
    padding: 20px;
  

}

.title

  .section1 {
    /* title banner section z */
    background-color: #731A44;
    height: fit-content;
    padding: 30px ;
    text-align: center;
    color: #fff;
    font-size: x-small;
  }

  .Join-Title-Banner{
    line-height: 1.6em;
    padding: 20px;
    letter-spacing: 0.62px;
    font-weight: 520;
    margin-bottom: 1.2em;
    width: auto;
    }
    
/* section1  */

.title-para{
  /* letter-spacing: 0.082em; */
  font-size: 1.20em;
  font-weight: 400;
  text-align:center;
  padding: 20px;

  
  }


  .section1a{

width: fit-content;

  }
/* section1a  */


.Titled{

font-size: xx-large;
margin: auto;
margin-bottom: 2.3em;

}
.bible-study-box{
min-width: fit-content;
margin: 0;
padding: 0;


}
.bible-study-box-list{
  font-size: medium;
text-align: center;
width: 100%;
}
}


.wk-title{
font-size: small;

}


@media screen and (max-width: 768px) {
 /* for small laptops */
  .Titlea {
    /* margin-left: 1425px; */
    margin-top: 0.2em;
    font-size:50px;
    letter-spacing: 0.56rem;
    font-weight: 500;
    color: #8C4573;
    border: #432137;
    border-width: 8px solid;
    }
    
 
              .section1a{

              min-height: 1568px;
              background-position-y: 75.5em;

              }



                                      .donnabw{

                                          margin-top: 3.4em;
                                          padding: 20px;
                                        

                                      }

.Donna-Title{
  margin-top: 12.3em;
  font-size:24px;

  }


  .donnabw{
    width: 100px;
    height: 300px;
    margin-top: 3.4em;
    padding: 40px;
  margin-right: 2.8em;

}
  .wk-title {
    font-size: 12px;
    font-weight: 800;
  color: #F3E0D2;
  
  }



  .bible-study-box{

    margin-bottom: 2.5rem;
      width: 100%;
    }


    .bible-study-box-list {
      font-size:44px;
      letter-spacing: 1.2em;
      color: white;
      font-weight: 500;
      
      }
  }


/* ipads and small macbook pro.*/
  @media screen and (max-width: 1280px) {
    

    .section1a{

   
      background-position-y: 66.5em;

      }



      .donnabw{
        margin-top: 2.4em;
        padding: 5px;
      


    }


      .Donna-Title{
        padding: 8px;
        font-size:4em;
      margin-top: 3.1em;
        }




        #section3-info{
          margin-top:7.4em ;
          width: 100%;

        }





        .bible-study-box{
      
          border-radius: 20px;
          margin-bottom: 1.5rem;
          box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.5); /* Add drop shadow */
            padding: 20px;
          
          }
          
          
          .col-lg-2{
width:90%

          }
          .bible-study-box-list {
          letter-spacing: 0.2em;
          font-size: small;
          color: white;
          font-weight: 500;
          
          
          }
        
          
.wk-title h2{
  font-size: 12px;
  font-weight: 800;
color: #F3E0D2;

}

  }  /* closing tag */




  @media screen and (min-width: 1440px){


    .section1a{

      height:2158px;
      background-position-y: 46.5em;
      }

.bible-study-box-list{
font-size: x-large;
margin: auto;
text-align: center;
width: fit-content;

}






  }


  @media screen and (max-width:2440px){
 
 .section1a{

   background-position-y: 76.5em;

 }
  }