.handshake {
    position: relative;
    animation: HandshakeAnimation 2s;
    animation-iteration-count: infinite;
    -webkit-animation: HandshakeAnimation 2s;
    -webkit-animation-iteration-count: infinite;
}

@keyframes HandshakeAnimation {
    0% {
        top: 0px;
    }

    16% {
        top: 20px;
    }

    32% {
        top: 0px;
    }

    48% {
        top: 20px;
    }

    64% {
        top: 0px;
    }

    100% {
        top: 0px;
    }
}

.signcontract {
    position: relative;
    animation: SignAnimation 2s;
    animation-iteration-count: infinite;
    -webkit-animation: SignAnimation 2s;
    -webkit-animation-iteration-count: infinite;
}

@keyframes SignAnimation {
    0% {
        left: -100px;
    }

    50% {
        left: 50px;
    }
    100% {
        left: 50px;
    }
}

.signcontractline {
    position: relative;
    animation: SignContractLine 2s;
    animation-iteration-count: infinite;
    -webkit-animation: SignContractLine 2s;
    -webkit-animation-iteration-count: infinite;
}

@keyframes SignContractLine {
    0% {
        width: 0%;
    }


   

    80% {
        width: 50%;
    }

    100% {
        width: 50%;
    }
}

.element {
    animation: rotate 2s infinite;
}

@keyframes rotate {
    0% {
        transform: rotate(-45deg)
    }

    25% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(0deg)
    }
}

.coding {
    animation: CodingBlock 2s infinite ;
    padding-right:10px;

}

@keyframes CodingBlock {
    0% {
        border-right  : solid ;
    }
    25% {
        border-right: none;
    }
    50% {
        border-right: solid;
    }
    75% {
        border-right: none;
    }
    100% {
        border-right: solid;
    }
}

.magnifying {
    animation: MagnifyingGlass 2s infinite;
    position:relative ;
}

@keyframes MagnifyingGlass {
    0% {
        height : 75px;
        width : 75px;
    }
    50% {
        height: 125px;
        width: 125px;
    }
    100% {
        height: 75px;
        width: 75px;
    }
}

.complete {
    position: relative;
    top: -70px;
     background-color: #F8F9FA ; 

    width: 200px;
    height: 70px;
    animation: CompleteCheck 2s infinite;
}

@keyframes CompleteCheck {
    0% {
       
        right: 0px;
    }

    50% {
       
        right: -200px;
    }

    100% {
       
     right: -200px;
    }
}

.rocket {
    transform: rotate(-45deg);
    position: relative;
    animation: RocketLaunch 3s infinite;
}

@keyframes RocketLaunch {
    0% {
        top: 0px;
    }
    25% {
        top: 0px;
    }
    100% {
        top: -150px;
    }
}


.Antigrav {
    position:relative ;
    animation: AntiGravAnimation 2s infinite;
}
.Antigrav2 {
    position: relative;
    animation: AntiGravAnimation 2s infinite;
    animation-delay: .25s;
}

.Antigrav3 {
    position: relative;
    animation: AntiGravAnimation 2s infinite;
    animation-delay: .5s;
}

.Antigrav4 {
    position: relative;
    animation: AntiGravAnimation 2s infinite;
    animation-delay: .75s;
}

@keyframes AntiGravAnimation {
    0% {
        top: 0px;
    }
    50% {
        top: 20px;
    }
    100% {
        top: 0px;
    }
}