body{
    margin: 0;
    padding: 10px;
}

.banner{
    padding: 0px;
    margin: 0px;
    border: 1px solid black;
    border-radius: 2px;
    background: url(https://media2.giphy.com/media/26xBAiTVwVehAUjdK/giphy.gif?cid=ecf05e47kh2cresvm8pck2in1cd46qefokzw9l2xv7rohz15&rid=giphy.gif) no-repeat;
    background-size: 300px 250px;
    width: 300px;
    height: 250px;
    overflow: hidden;
    color: black;
    text-align: center;
    font-family: sans-serif;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-animation: swinging 3.5s ease-in-out forwards infinite;
    -moz-animation: swinging 3.5s ease-in-out forwards infinite;
    animation: swinging 3.5s ease-in-out forwards infinite;
    animation-iteration-count: 2.70;
}

.title{
    margin: 10px;
    font-size: 45px;
    padding-bottom: 10px;
    text-shadow: 1px 1px 2px crimson;
    text-decoration: underline wavy coral;
    -webkit-animation: fadein 4s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 4s; /* Firefox < 16 */
        /*-ms-animation: fadein 4s; /* Internet Explorer */
         /*-o-animation: fadein 4s; /* Opera < 12.1 */
            animation: fadein 4s;
}

.Intro-1{
    margin: 0 0 20px 0;
    font-size: 16px;
    text-shadow: 1px 1px 2px crimson;
    padding-bottom: 0px;
    -webkit-animation: slidein 3s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: slidein 3s; /* Firefox < 16 */
            animation: slidein 3s;
}

.Intro-2{
    margin: 0 0 20px 0;
    font-size: 18px;
    color: cyan;
    font-weight: bold;
    text-shadow: 1px 1px 2px crimson;
    -webkit-animation: slidein 6s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: slidein 6s; /* Firefox < 16 */
            animation: slidein 6s;
}

/*.banner h4{
    margin: 0 0 20px 0;
    font-size: 16px;
    text-shadow: 1px 1px 2px crimson;
    padding-bottom: px;
    -webkit-animation: slidein 12s; /* Safari, Chrome and Opera > 12.1 */
       /*-moz-animation: slidein 12s; /* Firefox < 16 */
            /*animation: slidein 12s;
}*/

.banner a{
    display: inline-block;
    margin-top: 50px;
    padding: 10px 20px;
    background-color: rgb(218, 202, 248);
    color: #333;
    font-size: 20px;
    font-weight: bold;
    transition: 0.3s;
    text-decoration: none;
    -webkit-animation: fadein 12s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 12s; /* Firefox < 16 */
        /*-ms-animation: fadein 6s; /* Internet Explorer */
         /*-o-animation: fadein 6s; /* Opera < 12.1 */
            animation: fadein 12s;
}

/*.slidein{
    animation-iteration-count: 3;
    animation-duration: alternate;
}*/

.banner a:hover{
    background-color: rgba(238,230,255,.577);
    color: coral;
    font-size: x-large;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes slidein {
    from {
      margin-left: 100%;
      width: 300%; 
    }
    to {
      margin-left: 0%;
      width: 100%;
    }
}

/* Firefox < 16 */
@-moz-keyframes slidein {
    from {
        margin-left: 100%;
        width: 300%; 
    }
    to {
        margin-left: 0%;
        width: 100%;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes slidein {
    from {
        margin-left: 100%;
        width: 300%; 
    }
    to {
        margin-left: 0%;
        width: 100%;
    }
}

@keyframes swinging{
    0%{transform: rotate(10deg);}
    50%{transform: rotate(-5deg)}
    100%{transform: rotate(10deg);}
}

@-webkit-keyframes swinging{
    0%{-webkit-transform: rotate(10deg);}
    50%{-webkit-transform: rotate(-5deg)}
    100%{-webkit-transform: rotate(10deg);}
}

@-moz-keyframes swinging{
    0%{-webkit-transform: rotate(10deg);}
    50%{-webkit-transform: rotate(-5deg)}
    100%{-webkit-transform: rotate(10deg);}
}

/* Internet Explorer 
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}*/

/* Opera < 12.1 
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}
*/