@media only screen and (max-width: 600px) {
 
  .container {
    padding: 20px;
  }
  
}



body{
  background-color: #4d4b42;
  margin: 0;
  padding: 0;
 
  
}

.parent {
    position: relative;
    top: 0;
    left: 0;
  }
 
.image1{
    
        position: relative;
        top: 0;
        left: 0;
        background-position: center;
        width:100%;
        height: 200%;
      

}
  .image2 {

    position: absolute;
  top: 70px;
  left: 500px;
  right:500px;
  margin:auto;
  width:35%;

  
 
  
    
    
    
  }
  

 
  .navbar {
    background-color: #ffe586; 
    overflow: hidden;
    top: 0;
    position: fixed;
    width: 100%;
    z-index: 700;
  }

  
  .navbar a {
    float: left; 
    display: block; 
    color:#333; 
    text-align: center;
    padding: 14px 20px; 
    text-decoration: none; 
    background-color: #ffe586;
    font-size: 16pt;
    font-weight: 400;

  }

  
  .navbar a:hover {
    background-color: #f6e6ab; 
    color: #515151;
  }
  .container{
    position: relative;
    width: 100%; 
    height: 3000px; 
    overflow: hidden;
    
  }
  .lespaul{

    position: absolute;
    top: -5%;
    right: -40%;
    width: 100%;
    height: auto;
    z-index: 2;
  }
  .lespaul2{ 
   position: absolute;
    top: -5%;
    right: -20%;
    width: 100%;
    height: auto;
    z-index: 2;
    }
    


  
.impact{
  margin-top: -2200px;
  position:absolute;
  font-size: 30pt;
  color:#ffe586;
  margin-left:100px;
  width: 800px;
  border: 3px solid;
  border-radius: 4px;
  padding: 20px;
  border-color:#ffe586;
  background-color: rgb(120, 122, 122);
  
}



 
  

  .timeline {
    position: relative;
    text-align: left;
    width: 1000px;
    z-index: 2;
    padding-left: 40px;

  }
  
  .timeline-item {
    display: flex;
    margin-bottom: 20px;
  }
  
  .timeline-date {
    width: 100px;
    background-color: #333;
    color:  #ffe586;
    padding: 10px;
    text-align: center;
    font-size: 25pt;
    border:3px solid #ffe586;
    border-radius: 2px;
  }
  
  .timeline-content {
    flex: 1;
    padding: 10px;
    border: 2px solid  #ffe586;
    border-radius: 2px;
    color:  #ffe586;
    background-color: rgb(120, 122, 122);
  }
  
  .timeline-content h2 {
    margin-top: 0;
  }

  h1{
    right: 150px;
    color:  #ffe586;
    font-size: 49pt;
    text-align: center;
    
    

  }

  .Description{
    font-weight: 900;
  }

  h3{
    position:absolute;
    right: 150px;
    color:  #ffe586;
    font-size: 49pt;
    margin-right: 1000px;
    margin-top: -2350px;
    text-align: center;

    

  }

  h4{
    position:absolute;
    margin-top: -250px;
    color:  #ffe586;
    font-size: 49pt;
    margin-left: 600px;
  }


  .containerb {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto; 
    grid-row-gap: -500px; 
    margin: 0;
    padding: 0;
    height: auto;
    position: absolute;
    margin-top:-100px;
   
   
    
  }
  

 
  
  
  
  
  .jimmy img,
  .george img,
  .slash img, 
  .perry img, 
  .jimi img, 
  .paul img {
    border-color: #f6e6ab;
    border-width: 4px;
    border-style: solid;
    border-radius: 2px;
  }
  

  .jimmy img{
    height: 50%;
    width: 75%;
    margin-left: 5%;
    padding: 0;
    border-color: #f6e6ab;
    border-width: 4px;
    border-style: solid;
    
   
  }
  .george img{
    height: 50%;
    width: 75%;
    margin: 0;
    padding: 0;
   
  }

  .slash img{
    height: 50%;
    width: 75%;
    margin: 0;
    padding: 0;
    z-index: 1000;
    
  }
  .perry img{
    height: 50%;
    width: 75%;
    margin-left: 5%;
   
    padding: 0;
    
  }
  .jimi img{
    height: 50%;
    width: 75%;
    margin: 0;
    padding: 0;
    
  }
  .paul img{
    height: 50%;
    width: 85%;
     margin: 0;
    padding: 0;
    
  }

  .jimmytext{
    
    margin-left:150px;
    margin-top: 50px;
    font-size: 30pt;
    color:  #ffe586;
  }

  .georgetext{ 
    margin-left:90px;
    margin-top: 50px;
    font-size: 30pt;
    color:  #ffe586;
  }

  .slashtext{ 
    margin-left:170px;
    margin-top: 50px;
    font-size: 30pt;
    color:  #ffe586;
  }

  .perrytext{ 
    margin-left:165px;
    margin-top: 50px;
    font-size: 30pt;
    color:  #ffe586;
  }

  .jimitext{ 
    margin-left:110px;
    margin-top: 50px;
    font-size: 30pt;
    color:  #ffe586;
  }

  .paultext{
    margin-left:120px;
    margin-top: 50px;
    font-size: 30pt;
    color:  #ffe586;
  }