input {
    /* display: none !important; */
}

.section-2 > div > aside {
    display: flex;
    gap: 12px;           
    /* width: 453px; */
    flex-wrap: wrap;
    height: auto;
    border-radius: 20px;

    margin-bottom: 100px;
  }

  .section-2 > div > aside > aside {
    width: 453px;

  }
 * {
 scroll-behavior: smooth;
 }



  
  .section-2 > div > aside > aside {
  display: flex;

  align-items: center;
  justify-content: center;
  gap: 30px;
  margin-top: 150px;
}

.section-2 > div > aside > aside > img {
  width: 42px;height: 42px;
}

.section-2 > div > aside > aside> p > span {
  font-family: Montserrat;
font-weight: 600;
font-style: SemiBold;
font-size: 24px;
leading-trim: NONE;
line-height: 100%;
letter-spacing: 0%;
color: #fff;
}


.section-2 > div > aside > aside > span {
  font-family: Montserrat;
  font-weight: 600;
  font-style: SemiBold;
  font-size: 26px;
  leading-trim: NONE;
  line-height: 100%;
  letter-spacing: 0%;
  color: #fff;
  width: 150px;

}


.section-2 > div > aside > aside {
  margin-top: 0;
  margin-bottom: 40px;
  background-color: #000c;
  padding: 20px;
  border-radius: 10px;
}
  
  .section-2 .project {
    position: relative;
    width: 453px;
    border-radius: 20px;
    overflow: hidden;
    cursor: pointer;

  }

  .proekti .section-2 .project {
    margin-bottom: 130px;

  }
  
  /* картинка и видео в один размер */
  .section-2 .project img,
  .section-2 .project video {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 20px;
  }
  
  /* видео поверх, но невидимое по умолчанию */
  .section-2 .project video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    transition: opacity 180ms ease;
  }
  
  /* затемнялка картинки */
  .section-2 .project img {
    transition: filter 180ms ease;
  }
  
  /* состояния при hover будем включать классом */
  .section-2 .project.is-hover img {
    filter: brightness(0.6);
  }
  
  .section-2 .project.is-hover video {
    opacity: 1;
  }











  @media ((max-width: 1440px) and (min-width: 1280px)) {





    .section-2 > div > aside {
      /* align-items: center; */
      justify-content: center;
      display: flex;
      

      
    }

    .section-2 {
      position: relative;
      padding-bottom: 35px;
  
    }
    
    /* .section-2 > aside > * {
      margin-left: auto;
      margin-right: auto;
    } */






    .section-2 div:nth-child(1) {
      order: 1;
    }
    .section-2 div:nth-child(2) {
      order: 2;
    }
    .section-2 div:nth-child(3) {
      order: 5;
    }



    .section-2 aside:nth-child(4) {
      order: 3;
    }
    .section-2 aside:nth-child(5) {
      order: 4;
    }
    .section-2 aside:nth-child(6) {
      order: 7;
    }




    .section-2 div:nth-child(7) {
      order: 6;
    }
    .section-2 div:nth-child(8) {
      order: 9;
    }
    .section-2 div:nth-child(9) {
      order: 10;
    }



    
    .section-2 aside:nth-child(10) {
      order: 8;
    }
    .section-2 aside:nth-child(11) {
      order: 11;
    }
    .section-2 aside:nth-child(12) {
      order: 12;
    }

    .section-2 div:nth-child(13) {
      order: 13;
    }
    .section-2 div:nth-child(14) {
      order: 14;
    }
    .section-2 div:nth-child(15) {
      order: 17;
    }



    .section-2 aside:nth-child(16) {
      order: 15;
    }
    .section-2 aside:nth-child(17) {
      order: 16;
    }
    .section-2 aside:nth-child(18) {
      display: flex;
      position: absolute;
      bottom: 0;
    }



  }





















  .proekti .section-2 > div > aside > aside {
    position: absolute;
  }

  .proekti .section-2 > div > aside {
    position: relative;
    justify-content: space-between;
  }

  .proekti #_001 {
    left: 0px;
    top: 620px;
  }

  
  .proekti #_002 {
    top: 620px;
    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_003 {
    top: 620px;
    right: 0;
    
  }







  .proekti #_004 {
    left: 0px;
    top: 1370px;
  }

  
  .proekti #_005 {
    top: 1370px;

    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_006 {
    top: 1370px;

    right: 0;
    
  }



  .proekti #_007 {
    left: 0px;
    top: 2120px;
  }

  
  .proekti #_008 {
    top: 2120px;

    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_009 {
    top: 2120px;

    right: 0;
    
  }






  
  .proekti #_010 {
    left: 0px;
    top: 2870px;
  }

  
  .proekti #_011 {
    top: 2870px;

    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_012 {
    top: 2870px;

    right: 0;
    
  }







  .proekti #_013 {
    left: 0px;
    top: 3615px;
  }

  
  .proekti #_014 {
    top: 3615px;

    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_015 {
    top: 3615px;

    right: 0;
    
  }





  .proekti #_016 {
    left: 0px;
    top: 4360px;
  }

  
  .proekti #_017 {
    top: 4360px;

    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_018 {
    top: 4360px;

    right: 0;
    
  }



  
  .proekti #_019 {
    left: 0px;
    top: 5110px;
  }

  
  .proekti #_020 {
    top: 5110px;

    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_021 {
    top: 5110px;

    right: 0;
    
  }








  .proekti #_022 {
    left: 0px;
    top: 5860px;
  }

  
  .proekti #_023 {
    top: 5860px;

    left: 50%;
    right: 50%;
    transform: translateX(-50%);
  }

  
  .proekti #_024 {
    top: 5860px;

    right: 0;
    
  }



  .proekti #_025 {
    left: 0px;
    top: 6610px;
  }



  @media ((max-width: 1440px) and (min-width: 1280px)) {
    .proekti .section-2 > div > aside {
      justify-content: center;
    }







    .proekti #_001 {
      left: 50%;
      top: 620px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_002 {
      top: 620px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  
    








    
    .proekti #_003 {
      left: 50%;
      top: 1370px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_004 {
      top: 1370px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }



  
  
  





        
    .proekti #_005 {
      left: 50%;
      top: 2120px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_006 {
      top: 2120px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }

  

  


    .proekti #_007 {
      left: 50%;
      top: 2870px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_008 {
      top: 2870px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  
  


    .proekti #_009 {
      left: 50%;
      top: 3615px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_010 {
      top: 3615px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }

  
    

    .proekti #_011 {
      left: 50%;
      top: 4360px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_012 {
      top: 4360px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  
  
  
  
  
  
    .proekti #_013 {
      left: 50%;
      top: 5110px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_014 {
      top: 5110px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  
    
    .proekti #_015 {
      left: 50%;
      top: 5860px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_016 {
      top: 5860px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  

    

    

    .proekti #_017 {
      left: 50%;
      top: 6610px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_018 {
      top: 6610px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  
  
  


    .proekti #_019 {
      left: 50%;
      top: 7355px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_020 {
      top: 7355px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  




    .proekti #_021 {
      left: 50%;
      top: 8100px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_022 {
      top: 8100px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  







    .proekti #_023 {
      left: 50%;
      top: 8860px;
      right: auto;
      transform: translateX(calc(-1 * calc(100% + 5px)));

    }
  
    
    .proekti #_024 {
      top: 8860px;
      right: 50%;
      left: auto;
      transform: translateX(calc(100% + 5px));
    }
  






    .proekti #_025 {
      left: 50%;
      top: 9600px;
      right: auto;
      transform: translateX(-50%);

    }
  

     









  }

  @media (max-width: 1280px)  {


    .proekti .section-2 > div > aside > aside {
      position: relative !important;
      left: auto !important;
      right: auto !important;
      top: auto !important;
      transform: translateX(0) !important;
    }






    .proekti .section-2 .project:nth-child(1) {
      order: 1;
    }

    .proekti .section-2 .project:nth-child(2) {
      order: 3;
    }

    .proekti .section-2 .project:nth-child(3) {
      order: 5;
    }

    .proekti .section-2 .project:nth-child(4) {
      order: 7;
    }

    .proekti .section-2 .project:nth-child(5) {
      order: 9;
    }





    
    .proekti .section-2 .project:nth-child(6) {
      order: 11;
    }

    .proekti .section-2 .project:nth-child(7) {
      order: 13;
    }

    .proekti .section-2 .project:nth-child(8) {
      order: 15;
    }

    .proekti .section-2 .project:nth-child(9) {
      order: 17;
    }

    .proekti .section-2 .project:nth-child(10) {
      order: 19;
    }






    
    .proekti .section-2 .project:nth-child(11) {
      order: 21;
    }

    .proekti .section-2 .project:nth-child(12) {
      order: 23;
    }

    .proekti .section-2 .project:nth-child(13) {
      order: 25;
    }

    .proekti .section-2 .project:nth-child(14) {
      order: 27;
    }

    .proekti .section-2 .project:nth-child(15) {
      order: 29;
    }









    
    .proekti .section-2 .project:nth-child(16) {
      order: 31;
    }

    .proekti .section-2 .project:nth-child(17) {
      order: 33;
    }

    .proekti .section-2 .project:nth-child(18) {
      order: 35;
    }

    .proekti .section-2 .project:nth-child(19) {
      order: 37;
    }

    .proekti .section-2 .project:nth-child(20) {
      order: 39;
    }







    
    .proekti .section-2 .project:nth-child(21) {
      order: 41;
    }

    .proekti .section-2 .project:nth-child(22) {
      order: 43;
    }

    .proekti .section-2 .project:nth-child(23) {
      order: 45;
    }

    .proekti .section-2 .project:nth-child(24) {
      order: 47;
    }

    .proekti .section-2 .project:nth-child(25) {
      order: 49;
    }


    .proekti .section-2 .project {
      margin-bottom: 10px;
    }








    .proekti #_001 { order: 2; }
.proekti #_002 { order: 4; }

.proekti #_003 { order: 6; }
.proekti #_004 { order: 8; }

.proekti #_005 { order: 10; }
.proekti #_006 { order: 12; }

.proekti #_007 { order: 14; }
.proekti #_008 { order: 16; }

.proekti #_009 { order: 18; }
.proekti #_010 { order: 20; }

.proekti #_011 { order: 22; }
.proekti #_012 { order: 24; }

.proekti #_013 { order: 26; }
.proekti #_014 { order: 28; }

.proekti #_015 { order: 30; }
.proekti #_016 { order: 32; }

.proekti #_017 { order: 34; }
.proekti #_018 { order: 36; }

.proekti #_019 { order: 38; }
.proekti #_020 { order: 40; }

.proekti #_021 { order: 42; }
.proekti #_022 { order: 44; }

.proekti #_023 { order: 46; }
.proekti #_024 { order: 48; }

.proekti #_025 { order: 50; }








    .section-2 > div > aside {
      /* align-items: center; */
      justify-content: center;
      display: flex;
      

      
    }


    .section-2 > div > aside aside {
      width: 100%;
    }
    .section-2 {
      position: relative;
      padding-bottom: 35px;
  
    }
    
    /* .section-2 > aside > * {
      margin-left: auto;
      margin-right: auto;
    } */






    .section-2 div:nth-child(1) {
      order: 1;
    }
    .section-2 div:nth-child(2) {
      order: 3;
    }
    .section-2 div:nth-child(3) {
      order: 5;
    }



    .section-2 aside:nth-child(4) {
      order: 2;
    }
    .section-2 aside:nth-child(5) {
      order: 4;
    }
    .section-2 aside:nth-child(6) {
      order: 6;
    }




    .section-2 div:nth-child(7) {
      order: 7;
    }
    .section-2 div:nth-child(8) {
      order: 9;
    }
    .section-2 div:nth-child(9) {
      order: 11;
    }



    
    .section-2 aside:nth-child(10) {
      order: 8;
    }
    .section-2 aside:nth-child(11) {
      order: 10;
    }
    .section-2 aside:nth-child(12) {
      order: 12;
    }

    .section-2 div:nth-child(13) {
      order: 13;
    }
    .section-2 div:nth-child(14) {
      order: 15;
    }
    .section-2 div:nth-child(15) {
      order: 17;
    }



    .section-2 aside:nth-child(16) {
      order: 14;
    }
    .section-2 aside:nth-child(17) {
      order: 16;
    }
    .section-2 aside:nth-child(18) {
      order: 18;
 
    }



  }












  



  @media (max-width: 1280px) {
    .section-2 .project {
      width: 100%;
    }
  }