Animate and shake effect for rotated div using css3

I have been trying to use animate and shake effects for already rotated and absolute positioned div.

I have tried to use animate css from the following link:

https://daneden.github.io/animate.css/
What I want to achieve is following:

Top div coming from top side in rotating motion and position itself in defined absolute position
Middle div coming from right side in rotating motion and position itself in defined absolute position
Bottom div coming from bottom side in rotating motion and position itself in defined absolute position

How does my site look?

Hello,
I have recently created a website,
I was wondering if people here could take the time to check it out and give feedback,

Link: http://html-builder.tk

Thanks!

How to remove opacity from an Image

Good day guys and girls, i created two div tags and an image tag as shown below;

<div class="BackOpacityLayer">
    <div class ="CentreDiv">
        <img src="~/Images/nsmn-logo.gif" alt="logo" width="250" height="250"/>
    </div>
</div>

the "BackOpacityLayer" css style code is shown below;

.BackOpacityLayer
{
 
    width: 100%;
    /**/height: 450px;
    margin: -10px 0px -10px 0px;
    background-color: black;
    opacity: 0.8;
    filter: alpha(opacity=50);
    padding: 15% 0px 0px 0px;
 
}

Animated shrinking header image issue (codepen)

I have a codepen of an animated header here:

http://codepen.io/beelzebomb/pen/qELgdO"]http://codepen.io/beelzebomb/pen/qELgdO

The idea is that as you scroll content, the header shrinks out of the way - great for tablets.

But as you can see, the image shrinks to it's own centre, whereas the ideal situation would be for it to shrink to top left to keep the whole header in some sort of perspective - any ideas?

Syndicate content