function resizeContainer() {
      var x = $('.section_wrapper');
      var header_x = $('.header');
      var footer_x = $('.footer');
      var w = $(window).width();
      if(w < 920 && w > 0) { x.css("width", "306px");header_x.css("width", "306px");footer_x.css("width", "306px");}
      else if(w < 5000 && w > 920) { x.css("width", "918px");header_x.css("width", "918px");footer_x.css("width", "918px");}
};

$(document).ready(resizeContainer);
$(window).resize(resizeContainer)

$(document).ready( function() { 

  function beatBox(){
        $(".tile_2").append("<embed src='../sounds/beatbox.mp3' autostart='true' loop='false' width='0' height='0'></embed>");
        }
  

  //skills slide
  $(".skill_line").show('slide', {direction: 'left'}, 2000);

  //resume hover
  $(".resume").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#cccccc"}, 200); } );
  
  
  //tiles_hover
  $(".tile_1").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#e6e6e6"}, 200); } );
  $(".tile_1").click( function() { $(".tile_1_content").show("slide", { direction: "left" }, 500);}); $(".tile_1_content").click( function() { $(this).hide("slide", { direction: "left" }, 500);});
    
  $(".tile_2").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#cccccc"}, 200); } );
  $(".tile_2").click( function() { $(".tile_2_content").show("slide", { direction: "right" }, 500); beatBox(); }); $(".tile_2_content").click( function() { $(this).hide("slide", { direction: "right" }, 500);});
  
  $(".tile_3").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#cccccc"}, 200); } );
  
  $(".tile_4").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#e6e6e6"}, 200); } );
  $(".tile_4").click( function() { $(".tile_4_content").show("slide", { direction: "right" }, 500);}); $(".tile_4_content").click( function() { $(this).hide("slide", { direction: "right" }, 500);});
  
  $(".tile_5").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#e6e6e6"}, 200); } );
  $(".tile_5").click( function() { $(".tile_5_content").slideDown(500);});  $(".tile_5_content").click( function(){ $(this).slideUp(500);});
   
  $(".tile_6").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#e6e6e6"}, 200); } );
  
  $(".tile_7").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#cccccc"}, 200); } );
  
  $(".tile_8").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#cccccc"}, 200); } );
  $(".tile_8").click( function() { $(".tile_8_content").slideDown(500);});  $(".tile_8_content").click( function(){ $(this).slideUp(500);});
   
  $(".tile_9").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#e6e6e6"}, 200); } );
  
  $(".tile_10").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#e6e6e6"}, 200); } );
  
  $(".tile_11").hover( function() { $(this).animate({'background-color': "#ffcc00"}, 200); }, function() { $(this).animate({'background-color': "#e6e6e6"}, 200); } );
  


}  
);