#scroll_down {
     -skrollr-animation-name: scrollDowm;
}

@-skrollr-keyframes scrollDowm {
    0 {
        bottom: 2%;
        opacity: 1;
    }
    250 {
        bottom: -100%;
        opacity: 0;
    }
}
#properties {
    -skrollr-animation-name:animation1;
}

@-skrollr-keyframes animation1 {
    0 {
        top: -200%;
    }
    500 {
        bottom: 100%;
    }
    1500 {
        bottom: 30%;
        opacity: 1;
    }
    2100 {
        
    }
    2800 {
        top: -100%;
        opacity: 0;
    }
}

#transform {
    -skrollr-animation-name:transform;
}
@-skrollr-keyframes transform {
   
    500 {
        top: 100%;
    }
    1500 {
        top: 30%;
        opacity: 1;
    }
    2100 {
        
    }
    2800 {
        bottom: -100%;
        opacity: 0;
    }
}

#introduction-second {
    -skrollr-animation-name: introductionAnn;
}

@-skrollr-keyframes introductionAnn {
    0 {
        top: -200%;
    }
    500 {
        bottom: 200%;
    }
    4000 {
        bottom: 30%;
        opacity: 1;
    }
    5500 {
        
    }
    6000 {
        top: -100%;
        opacity: 0;
    }
}
#introduction-second-text {
    -skrollr-animation-name: introductionAnnText;
}
@-skrollr-keyframes introductionAnnText {
    0 {
        bottom: -200%;
    }
    500 {
        top: 200%;
    }
    4000 {
        top:80%;
        opacity: 1;
    }
    5500 {
        
    }
    6000 {
        bottom: -100%;
        opacity: 0;
    }
}
#logo{
    -skrollr-animation-name:logoAnm;
}
@-skrollr-keyframes logoAnm {
    
    4000 {
        width[swing]:0px;
        opacity:0;        
    }

    5000 {
        width[swing]:500px;
        opacity:1;
    }
}
header {
    -skrollr-animation-name:headerAnm;
}

@-skrollr-keyframes headerAnm {
    3700 {      
        opacity: 0;
        top:-100px;
    }
    4000 {
        
        opacity: 1;
        top:0;
    }
    
}
#about-top {
    -skrollr-animation-name: aboutAnn;
}

@-skrollr-keyframes aboutAnn {
    0 {
        top: -200%;
    }
    500 {
        bottom: 400%;
    }
    10000 {
        bottom: 40%;
        opacity: 1;
    }
    10500 {
        
    }
    12000 {
        top: -100%;
        opacity: 0;
    }
}
#about-bottom {
    -skrollr-animation-name:about-bottom;
}
@-skrollr-keyframes about-bottom {
   
    500 {
        top: 400%;
    }
    10000 {
        top: 50%;
        opacity: 1;
    }
    10500 {
        
    }
    12000 {
        bottom: -100%;
        opacity: 0;
    }
}
#speding-text {
    -skrollr-animation-name: speding-text;
}
@-skrollr-keyframes speding-text {
   
    000 {
        opacity:0;
        font-size[swing]:0px;
    }
    1000 {
        opacity:1;
        font-size[swing]:52px;
    }
}
#speding-text-heading {
    -skrollr-animation-name: speding-text-heading;
}
@-skrollr-keyframes speding-text {
   
    100 {
        opacity:0;
        font-size[swing]:0%;
    }
    1600 {
        opacity:1;
        font-size[swing]:100%;
    }
}
#Children-img {
    -skrollr-animation-name: children-img;
}
@-skrollr-keyframes children-img {
   
    500 {
        top:100%;
    }
    1500 {
        top: 50%;
        opacity:1;
    }
    3700 {
        bottom:-100%;
        opacity:0;
    }
} 
#scroll_down2{
    -skrollr-animation-name:scrdwn;
}
@-skrollr-keyframes scrdwn {   
   500 {
        top:100%;
         display:none;
    }
    1200 {
        top: 50%;
         display:block;
    }
    3700 {
        bottom:-100%;
        display:none;
    }
} 

#logo-wrapper {
    -skrollr-animation-name: logo-wrapper;
}
@-skrollr-keyframes logo-wrapper {
   
    000 {
        opacity:0;
        font-size[swing]:0px;
    }
    1000 {
        opacity:1;
        font-size[swing]:52px;
    }
}