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

  .container {
              text-align:center;
              margin-left:5%;



              
}



.list li {
          float:left;
          margin-right:3%;
          margin-top: 60px;
          width:30%;
          list-style:none;
          height:240px;
         display: wrap;
         border-radius:5px;
         box-shadow:pink 2px 1px 2px 1px;
         background-color: white;
       
         
          
}


.upcoming-project  {
     
      position: relative;

}

 .upcoming-project-tr td {
                          float: left;
} 

.upcoming-project-text{
     
       float: left;
       width: 100%;

}

.upcoming-project-subhead {
             font-weight: bold;
             font-size: 22px;
             color: grey;
             margin-top: 40px;
}

.project-td-head{
    
                 font-size: 22px;
                 

}
.project-td-subhead {
            
                    font-size: 18px;
                    
}

.upcoming-event-side-img {
     padding-left: 20px;
     padding-top: 70px; 
     padding-bottom: 50px; 
     float: left;
     width: 100%;
     
}







/***************************************************** ABOUT US PAGE  *********************************************/


/************************FOOTER***************/
.footer-item{
    
      width:50% ;
      
}




}



 

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



.upcoming-project  {
     
      position: relative;

}



 .upcoming-project-tr td {
                          float: left;
} 

.upcoming-project-text{
     
       float: left;
       width: 100%;

}

.upcoming-project-subhead {
             font-weight: bold;
             font-size: 22px;
             color: grey;
             margin-top: 40px;
}

.project-td-head{
    
                 font-size: 22px;
                 

}
.project-td-subhead {
            
                    font-size: 18px;
                    
}

.upcoming-event-side-img {
     padding-left: 20px;
     padding-top: 70px; 
     padding-bottom: 50px; 
     float: left;
     width: 100%;
     
}

.event-container {
                     
                     
                     max-width: 800px;
                   }

.event-container main{
  grid-template-columns: repeat(2, 1fr);

}
.blog-thumb:last-child {
  display: inline;
}





.project-td-head-countdown{
  width: 80%;
}




.objective-list li{
  float:none;
  margin-left: 36%;
}

.exco-container {
                     max-width: 700px;
      
}
.exco-container main{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid-gap: 30px;
  margin: 0 15px;
  margin-top: 70px;
}
/******************************************ABOUT US PAGE RESPONSIVE CSS CODE****************************************/

.about-kmsf{
  width: 100%;
  height: auto;
  text-align: center;
}


.about-kmsf  li{
  float:left;
  width:100%;
  list-style: none;
}

.about-kmsf li img{
  height: 500px;
  width: 100%;
  
}


.patron-container {max-width: 600px;
                     width: 100%;
                     margin: 0 auto;

}

.patron-container main{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid-gap: 30px;
  margin: 0 15px;
  margin-top: 70px;
}

.single-patron:last-child {
  left:55%; 

}


.text{
     padding-left:7%;
     padding-bottom:30px;
     width: 100%;
     height: 100%;
     padding-top: 50px;
}


.little-girl-img {
     width:0%;
     height: 0%;
     display: none;
}

.how-you-can-help-services {
                 
                   font-size: 10px;
}

.text{
     padding-left:7%;
     padding-bottom:30px;
     width: 93%;
     height: 100%;
     padding-top: 50px;
}



/******************************************CONTACT US PAGE RESPONSIVE CSS CODE****************************************/



.contact{
  left: 13%;
  position: relative;
}
.inner-contact {
   
   display: inline-grid;
   box-sizing: border-box;
   justify-content:center;
} 


.contact-item-i {
  width: auto;
  padding-left: 30px;
  box-sizing: border-box;
  color:#fff;
   background-color:#009933;
   justify-content: center;
   opacity: 0.97;


}
  




/************************FOOTER***************/
.footer-item{
    
      width:50% ;
      
}

}


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



.upcoming-project  {
     
      position: relative;

}



 .upcoming-project-tr td {
                          float: left;
} 

.upcoming-project-text{
     
       float: left;
       width: 100%;

}

.upcoming-project-subhead {
             font-weight: bold;
             font-size: 22px;
             color: grey;
             margin-top: 40px;
}

.project-td-head{
    
                 font-size: 22px;
                 

}
.project-td-subhead {
            
                    font-size: 18px;
                    
}

.upcoming-event-side-img {
     padding-left: 20px;
     padding-top: 70px; 
     padding-bottom: 50px; 
     float: left;
     width: 100%;
     
}


.event-container main{
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 20px;
}

.blog-thumb:last-child{
  display: inline;
}





.project-td-head-countdown{
  width: 80%;
}




.objective-list li{
  float:none;
  margin-left: 36%;
}


/******************************************ABOUT US PAGE RESPONSIVE CSS CODE****************************************/

.about-kmsf{
  width: 100%;
  height: auto;
  text-align: center;
}


.about-kmsf  li{
  float:left;
  width:100%;
  list-style: none;
}

.about-kmsf li img{
  height: 500px;
  width: 100%;
  
}




.text{
     padding-left:7%;
     padding-bottom:30px;
     width: 100%;
     height: 100%;
     padding-top: 50px;
}


.little-girl-img {
     width:0%;
     height: 0%;
     display: none;
}

.how-you-can-help-services {
                 
                   font-size: 10px;
}

.text{
     padding-left:7%;
     padding-bottom:30px;
     width: 93%;
     height: 100%;
     padding-top: 50px;
}



/******************************************CONTACT US PAGE RESPONSIVE CSS CODE****************************************/



.contact{
  left: 13%;
  position: relative;
}
.inner-contact {
   
   display: inline-grid;
   box-sizing: border-box;
   justify-content:center;
} 


.contact-item-i {
  width: auto;
  padding-left: 30px;
  box-sizing: border-box;
  color:#fff;
   background-color:#009933;
   justify-content: center;
   opacity: 0.97;


}
  




/************************FOOTER***************/
.footer-item{
    
      width:50% ;
      
}

}









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

.container {
              text-align:center;
              margin-left:10%;
              position: relative;        
}



.container p{
              font-family:tahoma;
              font-size: 18px; 
              padding-top:10px;
               padding-bottom:20px;
               width:90%;
               line-height: 34px;

} 
.list li {
          float:left;
          margin-top: 60px;
          width:90%;
          height: 260px;
          list-style:none;
         display: wrap;
         border-radius:5px;
         box-shadow:pink 2px 1px 2px 1px;
         background-color:white;   
          
}



/*****************************************   ABOUT US PAGE   ************************/


.event-container {
                  
                     max-width: 800px;
                   }


.event-container main{
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 15px;
}

.blog-thumb:last-child{
  display: inline;
}



.patron-container {max-width: 600px;
                     width: 100%;
                     margin: 0 auto;

}

.patron-container main{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid-gap: 15px;
  margin: 0 15px;
  margin-top: 70px;
}

.single-patron:last-child {
  left:55%; 

}




/******************************************CONTACT US PAGE RESPONSIVE CSS CODE****************************************/



.contact{
  left: 13%;
  position: relative;
}
.inner-contact {
   
   display: inline-grid;
   box-sizing: border-box;
   justify-content:center;
} 


.contact-item-i {
  width: auto;
  padding-left: 30px;
  box-sizing: border-box;
  color:#fff;
   background-color:#009933;
   justify-content: center;
   opacity: 0.97;


}
  
}

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

.event-container {
  max-width: 400px;
}

.event-container main{
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 30px;

}


.patron-container {
                     max-width: 350px;
      
}

.patron-container main{
  display: grid;
  grid-template-columns: repeat(1,1fr);
  grid-gap: 15px;
  margin: 0 15px;
  margin-top: 70px;
}

.single-patron:last-child {
  left:0%; 

}

}

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

  .exco-container {
                     max-width: 350px;
      
}
.exco-container main{
  grid-template-columns: repeat(1, 1fr);
  grid-gap: 15px;
  }

}


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

.banner{
  height:300px;
}

.container {
            text-align:center;
             
              position: relative;
              

              
}


.date-cont{
  margin-left: 30px;
}

.project-td{
 
  float: none;
  width: 100%;
  margin-left:0px;

}


.objective-list li{
  float: left;
  font-family: georgia;
  font-size: 20px;
  text-align: center;
  width:100%;
  margin-left: 0%;
  margin-top: 2%;
  list-style: none;
  padding-top: 30px;
  padding-bottom: 100px;
  

}






.event-head {

                font-family: tahoma;
                letter-spacing: 4px;
               font-size: 24px;
               text-align:center;
               

}



.our-team-head {
                 font-family:tahoma;     
                 text-align: center;
                 font-size: 24px;
                 letter-spacing: 4px;
                 


}

.objective h3 {
	font-size: 24px;
	letter-spacing: 4px;
}


/******************************************ABOUT US PAGE RESPONSIVE CSS CODE****************************************/

.about-kmsf{
  width: 100%;
  height: auto;
  text-align: center;
}


.about-kmsf  li{
  float:left;
  width:100%;
  list-style: none;
}

.about-kmsf li img{
  height: 400px;
  width: 100%;
  
}

.about-kmsf li p{
  font-size: 15px;

}

.border-1 p{
  font-size: 18px;
 
}


.little-girl-img {
     width:0%;
     height: 0%;
     display: none;
}

.how-you-can-help-services {
                   color: orangered;
                   font-size: 10px;
}

.text{
     padding-left:7%;
     padding-bottom:30px;
     width: 93%;
     height: 100%;
     padding-top: 50px;
}

.text li {
           font-size: 18px;
          
}

.text i{
    font-size: 20px;
    padding: 20px;
}


/******************************************CONTACT US PAGE RESPONSIVE CSS CODE****************************************/
.contact {
  
  /***  background-color: #009933; ****/
  
  width: 100%;
  margin-left:0% ;
  margin-right: 0%;
  margin-top: 3%;
  margin-bottom: 3%;
  background-attachment:fixed;
  


  
}


.inner-contact {
   
   display: inline-grid;
   box-sizing: border-box;
   justify-content:center;
} 

form {
  margin-top: 0px;
}


.form-bg {
  background-color: #003333;
  padding-left: 15px;
  padding-right: 0px;
  opacity: 0.95;
  justify-content: center;



}

.form {  
      width:300px; 
      height:45px; 
      padding-left:3px;

    }

  .form:hover{
    
    cursor: pointer; 
    transition:0.3s; 
    }
  
   .submit {margin:0px; 
             display:block; 
             width:130px; 
             height:40px; 
             background: none;
             border: 2px #009933 solid;
             font-family:sans-serif; 
             color:white; 
             font-size:20px;
             border-radius:10px; 
             
         }



.contact-item-i {
  width: auto;
  padding-left: 30px;
  box-sizing: border-box;
  color:#fff;
   background-color:#009933;
   justify-content: center;
   opacity: 0.97;


}
  



/*********************************** FOOTER  ************************/

.footer-item{
    
      width:100% ;
      
}


}







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

.upcoming-project-text-head {
           font-size: 27px;
               
  }


.project-td-head{
    
                 font-size: 19px;
                 

}
.Featured-date {
  font-size:16px;
}







.event-head {

              font-family: tahoma;
              letter-spacing: 2px;
              font-size: 24px;
               text-align:center;
               

}


.our-team-head {
                 font-family:tahoma;     
                 text-align: center;
                 font-size: 24px;
                 

}


}


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

.event-head {

                font-family: tahoma;
                letter-spacing: 2px;
               font-size: 18px;
               text-align:center;
               

}



.our-team-head {
                 font-family:tahoma;     
                 text-align: center;
                 font-size: 24px;
                 

}



}

@media only screen and (max-width: 320px)

 {


.project-td-head{
    
                 font-size: 16px;
                 

}
.Featured-date {
  font-size:14px;

}





/******************************************ABOUT US PAGE RESPONSIVE CSS CODE****************************************/

.about-kmsf{
  width: 100%;
  height: auto;
  text-align: center;
}


.about-kmsf  li{
  float:left;
  width:100%;
  list-style: none;
}

.about-kmsf li img{
  height: 500px;
  width: 100%; 
  
}





/*************************************   NEWS & EVENT   ****************************/


.event-head {

              font-family: tahoma;
                letter-spacing: 2px;
               font-size: 15px;
               text-align:center;
               

}



/************************************************  CONTACT US PAGE   *****************************/




.contact {
  
  /***  background-color: #009933; ****/
  /***opacity: 0.9; ****/
  background-size: cover;
  color: #eee;
  width: 100%;
  display: inline-block;
  margin-left:-13% ;
  margin-right:0%;
  margin-top: 0%;
  margin-bottom: 3%;
  background-attachment:fixed;
}



.inner-contact {
   
   display: inline-grid;
   box-sizing: border-box;
   justify-content:center;
} 

.contact-item-i {
  width: auto;
  padding-left: 2%;
  padding-right: 5%;

}


 .contact h3 {
   color:#fff;
  margin: 10px 0;
  font-size: 30px;
  font-weight: bold;
  font-family:cursive;
}


.form-bg {
  padding-left: 20px;
  padding-right: 10px;
}

.contact-item {
  width:100%;

}

.find-us {
  margin-top: 110px;


}


.find-us ul {
  list-style: none;
  color: #fff;
  font-size: 16px;
  letter-spacing: 0.3px;
  font-family: arial;
}



.contact .social-media i {
  height: 15px;
  width: 15px;
  margin: 10px 5px;
  font-size: 18px;
  padding: 12px;
  color: #fff;
  border-radius: 50% ;
  border:1px solid #fff;
}

.contact .social-media i:hover {
  background: #fff;
  color: #009933;
}

form {
  margin-top: 50px;
}

.form {   
      width:300px; 
      height:45px; 
      padding-left:8px;
    }

  .form:hover{
    
    cursor: pointer; 
    transition:0.3s; 
    }
  
   .submit {margin:0px; 
             display:block; 
             width:130px; 
             height:40px; 
             background: none;
             border: 2px #009933 solid;
             font-family:sans-serif; 
             color:white; 
             font-size:20px;
             border-radius:10px; 
             
         }

  .submit:hover{
                cursor: pointer; 
                transition:0.3s; 
                background:#009933;
                color: white;
               

            }
   .textarea  {
               margin-top:50px auto; 
               width:400px; 
               height:150px; 
               border-left: 4px solid #009933;
             color: white; 
             border-right: #003333;
             border-top: #003333;
             border-bottom: #003333;
             background:none;
               font-family:sans-serif;
               
             
            
          }

   .textarea::-moz-placeholder:{
        display:inline;
   }

  .textarea:hover{
            
            cursor: pointer;  
            transition: 0.3s; 
             
        }

}