Section elements not resizing/keeping format to different screen sizes?

For the life of me I cannot get these section elements to be responsive. I don't really know what I'm doing wrong. I think it may have to do with my media queries.

Any ideas? Or maybe I just have no idea what I'm doing when I thought I did. Quite possible!

<style>
	section.kppr{
      width: 100%;
      text-align: center;
      margin: -6% 0 0 0;
      float: center;
    }
  
  	.kppr p{
      font-size: 420%;
      color: #89d4e8;
      font-weight: bold;
    }
  
  .kppr img{
  	    max-width: 100%;
    	height: auto;
    	width: auto;
  }
  
  	.twgb{
      width: 14%;
      float: left;
      text-align: center;
      margin: 0 0 0 20%;
    }
  
  .twgb p{
  	line-height: 120%;
    font-weight: bold;
    padding: 4% 0 0 0;
    font-size: 115%;
    letter-spacing: 1px;
  }
  
  .descript{
  	  text-align: left;
  }
  
  .descript p{
  	  line-height: 120%;
      color: black;
      font-weight: bold;
      padding: 1% 0 0 0;
    
  }
  
  .discount img{
  	float: left;
    padding: 0 1%;
    max-width: 100%;
    height: auto;
    width: auto;
  }
  
  /*--------------------MEDIA!!!---------------*/
  @media screen and (max-width: 478px){
        body{
            position: absolute;
        }   
    }
  
   @media screen and (max-width: 740px){
     section{
     	position: absolute;
     }
   		section.kppr{
          float: left;
          width: 100%;
          margin: 0;
          padding: 0;
        }
     
     section.twgb{
       float: left;
       width: 100%;
       margin: 0;
       padding: 0;
     }
     
     section.descript{
       float: left;
       width: 100%;
       margin: 0;
       padding: 0;
     }
		
     section.discount{
       float: left;
       width: 100%;
       margin: 0;
       padding: 0;
     }
   }
  
</style>

<section class="kppr">
	<p>kids play <img src="http://static1.squarespace.com/static/55bed56ee4b04fdc6e0dd0d8/t/5759e5882b8ddea12fed577b/1465509256880/STL-Home-Heart.png" alt="kids play parents relax" /> parents relax</p>
</section>

<section class="twgb">
  <p><font color="#000">together we</font><br><font color="#89d4e8" size="6%">give back</font></p>
</section>

<section class="discount">
	<img src="http://static1.squarespace.com/static/55bed56ee4b04fdc6e0dd0d8/t/5759f17507eaa0ecb82b3677/1465512309355/STL-Home-5.png" alt="5% given back" />
</section>

<section class="descript">
	<p> of every dollar goes back to helping children <br>in foster care find safe and loving homes.</p>
</section>