.how-it-works-background {
    background-image: url(../imgs/hl-handshake.png); 
    background-size: cover; 
    /*background-repeat: no-repeat;*/ 
    width: 100%; 
    /*height: 60vh;*/
    /*border: 1px solid black;*/
}

.how-it-works {
}

.how-it-works-body {
    margin-top: 4%;
}

.hand-shake {
    /*position: relative;*/
    margin-top: 3%;
    /*-webkit-animation:bounce 1s infinite;*/
    position: absolute;
    z-index: 0;
    opacity: 0.4;
    align-self: flex-end;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}/*

*/.hand-shake-content {
    /*margin-top: 1%;*/
    position: relative;
    z-index: 1;
}

.hand-shake-logo {
    display:table;
}

.hand-shake-green-arrow {
    display:table;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: right;
}

.hand-shake-orange-arrow {
    display:table;
    margin-top: 6%;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.hand-shake-borrow-text {
    margin-left: 12%; 
    font-size: 1.5vw;
}
.hand-shake-invest-text {
    margin-right: 15%; 
    font-size: 1.5vw;
}

.handshake-borrow-invest {
    font-size: 12px;
}

.handshake-list {
    color: #9499A0;
    list-style: none;
    padding-left: 0;
    font-size: 0.9vw;
}

.handshake-h-line-height {
    line-height: 0.5;
    font-size: 1.7vw;
}

.handshake-list-right {
    width: 8rem;
}

.handshake-invest-svg {
    background-image: url('../imgs/hl-current-loan-requests.svg');
}

.handshake-img-border {
    border: 1px #367FEC solid;
    width: 23px;
    height: 23px;
}

.handshake-bullet-img {
    width: 70%;
}

.handshake-bounce-2 {
    animation-name: bounce-2;
    animation-timing-function: ease;
}

@keyframes bounce-2 {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-30px); }
    100% { transform: translateY(0); }
}

@media (max-width:768px){


    .hand-shake-invest-text {
        margin-right: 0;
        font-size: 1.4vw;
        margin-top: 2%;
    }

    .hand-shake-borrow-text {
        margin-left: 0;
        font-size: 1.4vw;
        margin-bottom: -7px;
    }

    .handshake-bullet-img {
        margin-top: -11px !important;
        width: 80%;
    }

    .handshake-img-border {
        width: 20px;
        height: 20px;
    }

    .handshake-list {
        margin-top: 0;
        font-size: 1vw;
    }

    .hand-shake {
        /*position: relative;*/
        margin-top: -12%;
        /*-webkit-animation:bounce 1s infinite;*/
        position: absolute;
        z-index: 0;
        opacity: 0.4;
        align-self: flex-end;
        animation-duration: 3s;
        animation-iteration-count: infinite;
    }


    .handshake-bounce-2 {
        animation-name: res-bounce-2;
        animation-timing-function: ease;
    }

    @keyframes res-bounce-2 {
        0%   { transform: translateY(0); }
        50%  { transform: translateY(-15px); }
        100% { transform: translateY(0); }
    }
}

@media (max-width:600px){


    .hand-shake-invest-text {
        margin-right: 0;
        font-size: 3.4vw;
        margin-top: 5%;
    }

    .hand-shake-borrow-text {
        margin-left: 0;
        font-size: 3.4vw;
        margin-bottom: -7px;
    }

    .handshake-bullet-img {
        margin-top: -11px !important;
        width: 80%;
    }

    .handshake-img-border {
        width: 20px;
        height: 20px;
    }

    .handshake-list {
        margin-top: 0;
        font-size: 3.4vw;
    }

    .hand-shake {
        /*position: relative;*/
        margin-top: -12%;
        /*-webkit-animation:bounce 1s infinite;*/
        position: absolute;
        z-index: 0;
        opacity: 0.4;
        align-self: flex-end;
        animation-duration: 3s;
        animation-iteration-count: infinite;
    }


    .handshake-bounce-2 {
        animation-name: res-bounce-2;
        animation-timing-function: ease;
    }

    @keyframes res-bounce-2 {
        0%   { transform: translateY(0); }
        50%  { transform: translateY(-15px); }
        100% { transform: translateY(0); }
    }
}