.p3{
    color: greenyellow;
    font-family: expand;
    text-align: center;
    height: 7vw;
    background: black;
    font-size: 4vw;
    vertical-align: middle;
    line-height: 7vw;
    transition: 1s;
    top: 75vw;
    position: absolute;
    width: 100vw;
}

.p-color{
  background: greenyellow;
  color: black;
  transition: 1s;
}

.container-act {
    top: 5vw;
    z-index: 999;
    height: 50vw;
    width: 100vw;
    filter: grayscale(50);
    position: absolute;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr ;
    gap: 10vw 0px;
    grid-auto-flow: row;
    grid-template-areas:
      "img1-1 . img1-2 . img1-3 . img1-4"
      ". img2-1 . img2-2 . img2-3 ."
      "img3-1 . img3-2 . img3-4 . img3-5"
      ". img4-1 . img4-2 . img4-3 ."
      "img5-1 . img5-2 . img5-3 . img5-4"
      ". img6-1 . img6-2 . img6-3 .";
  }
   
    
   .imgS, .imgM, .imgD, .imgN{
     
      height: 5vw;
      width: 10vw;
      transition: all 1s;
      mix-blend-mode: difference;
      cursor: none;
     
  }
  
  .imgN.animate, .imgS.animate, .imgD.animate, .imgM.animate{
    transform: scale(2);
  }
  .imgS.animateS, .imgN.animateS, .imgM.animateS, .imgD.animateS{
    transform: scale(2);
  }
  
  .imgN.animateS, .imgD.animateS{
    transform-origin: top;
  }img
  
  
  .imgS.animateS{
    transform-origin: left;
  }
  
  
  
  
  .imgS:hover{transform: scale(4);transition: 1s;z-index: 999;}
  .imgD:hover{transform: scale(4);transition: 1s;z-index: 999;}
  .imgN:hover{transform: scale(4);transition: 1s;z-index: 999;}
  .imgM:hover{transform: scale(4);transition: 1s;z-index: 999;}
  
  .small{
    transform: scale(0.1);
  
  
  }
  
  
    .img1-1 { 
        grid-area: img1-1;
        background-image: url(.//Images/Activities/Sports/Biden_01_S.jpeg);
        background-size: 100%;
       
      
     
      
      }
    
    .img1-2 { grid-area: img1-2;
      background-image: url(.//Images/Activities/Nature/Clinton_01_N.jpeg);
      background-size: 100%;
     
     
    
  
  }
    
    .img1-3 { 
        grid-area: img1-3;
        background-image: url(.//Images/Activities/Drugs/Miley_01_D.jpeg);
        background-size: 100%;
     
       }
    
    .img1-4 { 
        grid-area: img1-4;
        background-image: url(.//Images/Activities/Music/Obama_01_M.jpeg);
        background-size: 100%;
    
      
      }
    
    .img2-1 { 
        grid-area: img2-1;
        background-image: url(.//Images/Activities/Nature/Perry_01_N.jpeg);
        background-size: 100%;
   
      }
    
    .img2-2 { 
        grid-area: img2-2; 
        background-image: url(.//Images/Activities/Music/Bieber_01_M.jpeg);
        background-size: 100%;
       
      }
    
    .img2-3 { 
        grid-area: img2-3;
        background-image: url(.//Images/Activities/Sports/zuck_01_S.jpeg);
        background-size: 100%;
         
  
  }
    
    .img3-1 { 
        grid-area: img3-1;
        background-image: url(.//Images/Activities/Sports/Trump_01_S.jpeg);
        background-size: 100%;
       
        
   }
    
    .img3-2 { 
        grid-area: img3-2;
        background-image: url(.//Images/Activities/Drugs/Rihanna_01_D.jpg);
        background-size: 100%;
     
  }
    
    .img3-4 { 
        grid-area: img3-4; 
        background-image: url(.//Images/Activities/Nature/Queen_02_N.jpeg);
        background-size: 100%;
        
      }
    
    .img3-5 { 
        grid-area: img3-5; 
        background-image: url(.//Images/Activities/Music/Elon_01_M.jpeg);
        background-size: 100%;
      
  }
    
    .img4-1 {
         grid-area: img4-1;
         background-image: url(.//Images/Activities/Nature/Queen_01_N.jpeg);
         background-size: 100%;
        
   }
   
    
    .img4-2 { 
        grid-area: img4-2; 
        background-image: url(.//Images/Activities/Drugs/Elon_01_D.jpeg);
        background-size: 100%;
       
      }
    
    .img4-3 { 
        grid-area: img4-3; 
        background-image: url(.//Images/Activities/Sports/Trump_03_S.jpeg);
        background-size: 100%;
          
      }
    
    .img5-1 { grid-area: img5-1;
      background-image: url(.//Images/Activities/Sports/Trump_02_S.jpeg);
      background-size: 100%;
       
  }
    
    .img5-2 { 
        grid-area: img5-2; 
        background-image: url(.//Images/Activities/Music/Swift_01_M.jpeg);
        background-size: 100%;
    
  }
    
    .img5-3 { 
        grid-area: img5-3;
        background-image: url(.//Images/Activities/Drugs/Bieber_01_D.jpeg);
        background-size: 100%; 
   } 
    
    .img5-4 { 
        grid-area: img5-4;
        background-image: url(.//Images/Activities/Drugs/Obama_01_D.jpg);
        background-size: 100%;
        
  }
    
    .img6-1 { 
        grid-area: img6-1; 
        background-image: url(.//Images/Activities/Music/Trump_01_M.png);
        background-size: 100%;
         
  }
    
    .img6-2 { 
        grid-area: img6-2; 
        background-image: url(.//Images/Activities/Music/Obama_02_M.jpeg);
        background-size: 100%;
      
        
  }
    
    .img6-3 { 
        grid-area: img6-3; 
        background-image: url(.//Images/Activities/Sports/Zuck_02_S.png);
        background-size: 100%;
        
  }
  
   
  .off{
      filter: grayscale(50) blur(50px);
      pointer-events: none;
  }
  
  
  
  .img1-1,.img3-1,.img5-1{
    left: 90vw;
    position: absolute;
    transition: 2s;
  }
  
  .img2-1,.img4-1,.img6-1{
    left: 57vw;
    position: absolute;
    transition: 2s;
  }
  
  .img1-2,.img3-2,.img5-2{
    left: 28vw;
    position: absolute;
    transition: 2s;
   
  }
  
  .img1-3,.img3-4,.img5-3{
    right: 33vw;
    position: absolute;
    transition: 2s;
  }
  .img2-3,.img4-3,.img6-3{
    right: 62vw;
    position: absolute;
    transition: 2s;
  }
  
  .img1-4,.img3-5,.img5-4{
    right: 90vw;
    position: absolute;
    transition: 2s;
  }
  .img2-2,.img4-2,.img6-2{
    left:0vw;
    position: absolute;
    transition: 2s;
  }
  
  
  
  
  .backto{
    left: 0vw;
  }
  .backto-right{
    right: 0vw;
  }
  .curs-act{
    height: 5vw;
    width: 10vw;
    background-color: greenyellow;
    text-align: center;
    padding:10px ;
    font-size: 2vw;
    font-family:extend;
    color: black;
    display: none; 
   text-align: center;
   vertical-align: middle;
   line-height: 4vw;

  }

  .curs-act-click{
    width: 26vw;
    height: 13vw;
    background-color: greenyellow;
    text-align: center;
    padding:10px ;
    font-size: 2vw;
    font-family:extend;
    color: black;
    display: none; 
   text-align: center;
   vertical-align: middle;
   line-height: 2vw;
   padding-top: 10px;
  }

 .curs-reload{
    width: 26vw;
    height: 13vw;
    background-color: greenyellow;
    text-align: center;
    padding:10px ;
    font-size: 3em;
    font-family:extend;
    color: black;
    display: none; 
   text-align: center;
   vertical-align: middle;
   line-height: 10vh;
   padding-top: 30px;
  }
  .show-curs{
    display: block;
  }
 .hide-curs{
   display: none;
 }