/*animacje*/




.scale-in-ver-left {
-webkit-animation: scale-in-ver-left 2s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        animation: scale-in-ver-left 2s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
@keyframes scale-in-ver-left {
    0% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
    }
    25% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;

    width: 5px;
    }

    55%{
        top:25vh;
    width: 95vw;
    }
    70% {
    height: 60vh;
    top: 25vh
    }
    100% {
    width: 70px;
    height: 70px;
    top: 0;

    }
    
    
}
.scale-in-ver-top {
        -webkit-animation: scale-in-ver-top 0.3s 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                animation: scale-in-ver-top 0.3s 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    }
    
    @-webkit-keyframes scale-in-ver-top {
        0% {
        
        opacity: 0;
        }
        100% {
        
        opacity: 1;
        }
        }
        @keyframes scale-in-ver-top {
        0% {
        opacity: 0;
        }
        100% {
        
        opacity: 1;
        }
    }
    
    .photo-hidden {
        -webkit-animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    }
    
    @-webkit-keyframes photo-hidden {
        0% {
        
        opacity: 0;
        }
        100% {
        
        opacity: 1;
        }
        }
        @keyframes photo-hidden {
        0% {
        opacity: 0;
        }
        100% {
        
        opacity: 1;
        }
    }
    .photoHidden {
        opacity: 0;
    }
    .team-photo {
        -webkit-animation: team-photo 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                animation: team-photo 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
        @keyframes team-photo {
           
            25% {
            
            opacity: 1;
        
            width: 2px;
            }
        
            35%{
            height: 100%;
            
            }
            50% {
                width: 100%;
    
            }
           
            
            100% {
            width: 0;
            height: 100%;
            }
        }
       
    
        .photo-hidden {
            -webkit-animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                    animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
        
        @-webkit-keyframes photo-hidden {
            0% {
            
            opacity: 0;
            }
            100% {
            
            opacity: 1;
            }
            }
            @keyframes photo-hidden {
            0% {
            opacity: 0;
            }
            100% {
            
            opacity: 1;
            }
        }
        .photoHidden {
            opacity: 0;
        }
        
    .text-top {
        -webkit-animation: text-top 1s  cubic-bezier(.445,.05,.55,.95) both;
                animation: text-top 1s  cubic-bezier(.445,.05,.55,.95) both;
    }
    
    @-webkit-keyframes text-top {
        0% {
        -webkit-transform: translateY(100px);
                transform: translateY(100px);
        }
        100% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        }
    }
    @keyframes text-top {
        0% {
        -webkit-transform: translateY(100px);
                transform: translateY(100px);
                opacity: 0;
        }
    
        100% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
                opacity: 1;
        }
    }
    .textTop {
        opacity: 0;
    }
    .name-animation {
        -webkit-animation: name-animation 1.3s 0.3s  cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
            animation: name-animation 1.3s 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
    }
       
    @-webkit-keyframes name-animation {
        0% {
          letter-spacing: 1em;
          -webkit-transform: translateZ(400px);
                  transform: translateZ(400px);
          opacity: 0;
        }
        40% {
          opacity: 0.6;
        }
        100% {
          -webkit-transform: translateZ(0);
                  transform: translateZ(0);
          opacity: 1;
        }
      }
      @keyframes name-animation {
        0% {
          letter-spacing: 0.3em;
          -webkit-transform: translateZ(400px);
                  transform: translateZ(400px);
          opacity: 0;
        }
        40% {
          opacity: 0.6;
        }
        100% {
          -webkit-transform: translateZ(0);
                  transform: translateZ(0);
          opacity: 1;
        }
      }
    
      .name {
          opacity: 0;
      }
    
    .description-animation {
            -webkit-animation: description-animation 1s 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                    animation: description-animation 1s 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    }
    
     @-webkit-keyframes description-animation {
        0% {
          -webkit-transform: translateY(20px);
                  transform: translateY(20px);
            opacity: 0;
        }
        100% {
          -webkit-transform: translateY(0);
                  transform: translateY(0);
            opacity: 1;
        }
      }
      @keyframes description-animation {
        0% {
          -webkit-transform: translateY(20px);
                  transform: translateY(20px);
            opacity: 0;
        }
        100% {
          -webkit-transform: translateY(0);
                  transform: translateY(0);
            opacity: 1;
        }
      }
    
      .scale-line {
            -webkit-animation: scale-line 0.5s 0.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
                    animation: scale-line 0.5s 0.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
    }
    
     @-webkit-keyframes scale-line {
        0% {
          -webkit-transform: scaleX(0);
                  transform: scaleX(0);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
        }
        100% {
          -webkit-transform: scaleX(1);
                  transform: scaleX(1);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
        }
      }
      @keyframes scale-line {
        0% {
          -webkit-transform: scaleX(0);
                  transform: scaleX(0);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
        }
        100% {
          -webkit-transform: scaleX(1);
                  transform: scaleX(1);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
        }
      }
    
      
      
      .squer-animation
       {
        -webkit-animation: squer-animation 0.7s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                animation: squer-animation 0.7s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    }
    
    
    
     @-webkit-keyframes squer-animation {
        0% {
          -webkit-transform: scale(0);
                  transform: scale(0);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
                  
        }
        100% {
          -webkit-transform: scale(1);
                  transform: scale(1);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
        }
      }
      @keyframes squer-animation {
        0% {
          -webkit-transform: scale(0);
                  transform: scale(0);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
        }
        100% {
          -webkit-transform: scale(1);
                  transform: scale(1);
          -webkit-transform-origin: 0% 0%;
                  transform-origin: 0% 0%;
                  opacity: 1;
        }
      }
      
      .squeranimation {
          opacity: 0;
      }


      @media screen and (min-width: 997px) {

        .scale-in-ver-top {
            -webkit-animation: scale-in-ver-top 0.3s 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                    animation: scale-in-ver-top 0.3s 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
        
        @-webkit-keyframes scale-in-ver-top {
            0% {
            
            opacity: 0;
            }
            100% {
            
            opacity: 1;
            }
            }
            @keyframes scale-in-ver-top {
            0% {
            opacity: 0;
            }
            100% {
            
            opacity: 1;
            }
        }
        
        .photo-hidden {
            -webkit-animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                    animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
        
        @-webkit-keyframes photo-hidden {
            0% {
            
            opacity: 0;
            }
            100% {
            
            opacity: 1;
            }
            }
            @keyframes photo-hidden {
            0% {
            opacity: 0;
            }
            100% {
            
            opacity: 1;
            }
        }
        .photoHidden {
            opacity: 0;
        }
        
        
        
        .scale-in-ver-left {
        -webkit-animation: scale-in-ver-left 2s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                animation: scale-in-ver-left 2s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
        @keyframes scale-in-ver-left {
            0% {
            -webkit-transform: scaleY(0);
            transform: scaleY(0);
            -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
            opacity: 1;
            }
            25% {
            -webkit-transform: scaleY(1);
            transform: scaleY(1);
            -webkit-transform-origin: 100% 0%;
            transform-origin: 100% 0%;
            opacity: 1;
        
            width: 10px;
            }
        
            55%{
            width: 60vw;
            }
            70% {
            height: 80vh;
            top: 10vh
            }
            90%{
            top:10vh;
        
            }
            100% {
            width: 60px;
            height: 50%;
            top: 0;
        
            }
        }
        .team-photo {
            -webkit-animation: team-photo 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                    animation: team-photo 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            }
            @keyframes team-photo {
               
                25% {
                
                opacity: 1;
            
                width: 2px;
                }
            
                35%{
                height: 100%;
                
                }
                50% {
                    width: 100%;
        
                }
               
                
                100% {
                width: 0;
                height: 100%;
                }
            }
           
        
            .photo-hidden {
                -webkit-animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                        animation: photo-hidden 0.3s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
            }
            
            @-webkit-keyframes photo-hidden {
                0% {
                
                opacity: 0;
                }
                100% {
                
                opacity: 1;
                }
                }
                @keyframes photo-hidden {
                0% {
                opacity: 0;
                }
                100% {
                
                opacity: 1;
                }
            }
            .photoHidden {
                opacity: 0;
            }
            
        .text-top {
            -webkit-animation: text-top 1s  cubic-bezier(.445,.05,.55,.95) both;
                    animation: text-top 1s  cubic-bezier(.445,.05,.55,.95) both;
        }
        
        @-webkit-keyframes text-top {
            0% {
            -webkit-transform: translateY(100px);
                    transform: translateY(100px);
            }
            100% {
            -webkit-transform: translateY(0);
                    transform: translateY(0);
            }
        }
        @keyframes text-top {
            0% {
            -webkit-transform: translateY(100px);
                    transform: translateY(100px);
                    opacity: 0;
            }
        
            100% {
            -webkit-transform: translateY(0);
                    transform: translateY(0);
                    opacity: 1;
            }
        }
        .textTop {
            opacity: 0;
        }
        .name-animation {
            -webkit-animation: name-animation 1.3s 0.3s  cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
                animation: name-animation 1.3s 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
        }
           
        @-webkit-keyframes name-animation {
            0% {
              letter-spacing: 1em;
              -webkit-transform: translateZ(400px);
                      transform: translateZ(400px);
              opacity: 0;
            }
            40% {
              opacity: 0.6;
            }
            100% {
              -webkit-transform: translateZ(0);
                      transform: translateZ(0);
              opacity: 1;
            }
          }
          @keyframes name-animation {
            0% {
              letter-spacing: 0.3em;
              -webkit-transform: translateZ(400px);
                      transform: translateZ(400px);
              opacity: 0;
            }
            40% {
              opacity: 0.6;
            }
            100% {
              -webkit-transform: translateZ(0);
                      transform: translateZ(0);
              opacity: 1;
            }
          }
        
          .name {
              opacity: 0;
          }
        
        .description-animation {
                -webkit-animation: description-animation 1s 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                        animation: description-animation 1s 1.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
        
         @-webkit-keyframes description-animation {
            0% {
              -webkit-transform: translateY(20px);
                      transform: translateY(20px);
                opacity: 0;
            }
            100% {
              -webkit-transform: translateY(0);
                      transform: translateY(0);
                opacity: 1;
            }
          }
          @keyframes description-animation {
            0% {
              -webkit-transform: translateY(20px);
                      transform: translateY(20px);
                opacity: 0;
            }
            100% {
              -webkit-transform: translateY(0);
                      transform: translateY(0);
                opacity: 1;
            }
          }
        
          .scale-line {
                -webkit-animation: scale-line 0.5s 0.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
                        animation: scale-line 0.5s 0.3s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
        }
        
         @-webkit-keyframes scale-line {
            0% {
              -webkit-transform: scaleX(0);
                      transform: scaleX(0);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
            }
            100% {
              -webkit-transform: scaleX(1);
                      transform: scaleX(1);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
            }
          }
          @keyframes scale-line {
            0% {
              -webkit-transform: scaleX(0);
                      transform: scaleX(0);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
            }
            100% {
              -webkit-transform: scaleX(1);
                      transform: scaleX(1);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
            }
          }
        
          
          
          .squer-animation
           {
            -webkit-animation: squer-animation 0.7s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
                    animation: squer-animation 0.7s 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
        }
        
        
        
         @-webkit-keyframes squer-animation {
            0% {
              -webkit-transform: scale(0);
                      transform: scale(0);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
                      
            }
            100% {
              -webkit-transform: scale(1);
                      transform: scale(1);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
            }
          }
          @keyframes squer-animation {
            0% {
              -webkit-transform: scale(0);
                      transform: scale(0);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
            }
            100% {
              -webkit-transform: scale(1);
                      transform: scale(1);
              -webkit-transform-origin: 0% 0%;
                      transform-origin: 0% 0%;
                      opacity: 1;
            }
          }
          
          .squeranimation {
              opacity: 0;
          }
         
     
      @media screen and (min-width: 1100px) {
    
        .name-animation {
            -webkit-animation: name-animation 1.3s 0.3s  cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
                animation: name-animation 1.3s 0.3s cubic-bezier(0.215, 0.610, 0.355, 1.000) both;
        }
           
        @-webkit-keyframes name-animation {
            0% {
              letter-spacing: 1em;
              -webkit-transform: translateZ(400px);
                      transform: translateZ(400px);
              opacity: 0;
            }
            40% {
              opacity: 0.6;
            }
            100% {
              -webkit-transform: translateZ(0);
                      transform: translateZ(0);
              opacity: 1;
            }
          }
          @keyframes name-animation {
            0% {
              letter-spacing: 0.7em;
              -webkit-transform: translateZ(400px);
                      transform: translateZ(400px);
              opacity: 0;
            }
            40% {
              opacity: 0.6;
            }
            100% {
              -webkit-transform: translateZ(0);
                      transform: translateZ(0);
              opacity: 1;
            }
          }
        
          .name {
              opacity: 0;
          }
    
    
    
      }
      


}