body {
    font-family: "adobe-clean", "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 0px;
    background: #049ec4 !important;
}


.animate-bg {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%;
    background: #049ec4 url('awan-top.jpg') repeat-x 50% 100%;
    -webkit-animation: animate-cloud-top 30s linear infinite;
        -moz-animation: animate-cloud-top 30s linear infinite;
        -ms-animation: animate-cloud-top 30s linear infinite;
        -o-animation: animate-cloud-top 30s linear infinite;
        animation: animate-cloud-top 30s linear infinite;

}

.wrapper-messages{
    position: relative; /* Needed for positioning the mask */
    -webkit-mask-image: linear-gradient(
      to bottom,
      transparent,
      black 50px,
      black calc(100% - 50px),
      transparent
    );
    mask-image: linear-gradient(
      to bottom,
      transparent,
      black 50px,
      black calc(100% - 50px),
      transparent
    );
  }

@media only screen and (min-width: 760px) {
}

@-webkit-keyframes animate-cloud-top {
    from {
        background-position: 1000px 0;
    }
    to {
        background-position: 0 0;
    }
}

@-moz-keyframes animate-cloud-top {
    from {
        background-position: 1000px 0;
    }
    to {
        background-position: 0 0;
    }
}

@-ms-keyframes animate-cloud-top {
    from {
        background-position: 1000px 0;
    }
    to {
        background-position: 0 0;
    }
}

@-o-keyframes animate-cloud-top {
    from {
        background-position: 1000px 0;
    }
    to {
        background-position: 0 0;
    }
}



@-webkit-keyframes animate-cloud {
    from {
        background-position: 1000px 100%;
    }
    to {
        background-position: 0 100%;
    }
}

@-moz-keyframes animate-cloud {
    from {
        background-position: 1000px 100%;
    }
    to {
        background-position: 0 100%;
    }
}

@-ms-keyframes animate-cloud {
    from {
        background-position: 1000px 100%;
    }
    to {
        background-position: 0 100%;
    }
}

@-o-keyframes animate-cloud {
    from {
        background-position: 1000px 100%;
    }
    to {
        background-position: 0 100%;
    }
}


@media only screen and (max-width: 759px) {
    .animate-bg {
        height: 100%;
        background-size: 500px 242px;
    }

}