@charset "utf-8";
/* Animations For Main Page For AL HADID GENERAL TRADINGS */



/*Bounce In*/
@-webkit-keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -7%, 0);
            transform: translate3d(0, -7%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -7%, 0);
            transform: translate3d(0, -7%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}
.bounceIn1 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: .50s;
          animation-duration: .50s;
}
.bounceIn2 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
}
.bounceIn3 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 1.50s;
          animation-duration: 1.50s;
}
.bounceIn4 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}
.bounceIn5 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 2.5s;
          animation-duration: 2.5s;
}
.bounceIn6 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
}
.bounceIn7 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 3.5s;
          animation-duration: 3.5s;
}
.bounceIn8 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 4s;
          animation-duration: 4s;
}
.bounceIn9 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 4.5s;
          animation-duration: 4.5s;
}
.bounceIn10 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 5s;
          animation-duration: 5s;
}
.bounceIn11 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 5.5s;
          animation-duration: 5.5s;
}
.bounceIn12 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 6s;
          animation-duration: 6s;
}
.bounceIn13 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 6.5s;
          animation-duration: 6.5s;
}
.bounceIn14 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 7s;
          animation-duration: 7s;
}
.bounceIn15 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 7.5s;
          animation-duration: 7.5s;
}
.bounceIn16 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 8s;
          animation-duration: 8s;
}
.bounceIn17 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 8.5s;
          animation-duration: 8.5s;
}
.bounceIn18 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 9s;
          animation-duration: 9s;
}
.bounceIn19 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 9.5s;
          animation-duration: 9.5s;
}
.bounceIn20 {
  -webkit-animation-name: bounceIn;
          animation-name: bounceIn;
  -webkit-animation-duration: 10s;
          animation-duration: 10s;
}

/*End Bounce In*/


@-webkit-keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes bounceInDown {
  0%, 60%, 75%, 90%, 100% {
    -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
            transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
            transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
            transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
            transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
            transform: translate3d(0, 5px, 0);
  }

  100% {
    -webkit-transform: none;
            transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
          animation-name: bounceInDown;
		  -webkit-animation-duration: .75s;
          animation-duration: .75s;
}






/*FADE IN LEFT*/
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
          animation-name: fadeInLeft;
		  -webkit-animation-duration:1s;
          animation-duration:1s;
}
/*FADE IN LEFT END*/


/*FADE IN RIGHT*/
@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
          animation-name: fadeInRight;
		  -webkit-animation-duration:1s;
          animation-duration:1s;
}
/*FADE IN RIGHT END*/



/*ZOOM*/

@-webkit-keyframes zoomInbig {
  0% {
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomInbig {
  0% {
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}
.zoomInbig {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:1s;
          animation-duration:1s;
}







@-webkit-keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
            transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:1s;
          animation-duration:1s;
}
.zoomIn1 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:.3s;
          animation-duration:.3s;
}
.zoomIn2 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:.6s;
          animation-duration:.6s;
}
.zoomIn3 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:.9s;
          animation-duration:.9s;
}
.zoomIn4 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:1.2s;
          animation-duration:1.2s;
}
.zoomIn5 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:1.5s;
          animation-duration:1.5s;
}
.zoomIn6 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:1.8s;
          animation-duration:1.8s;
}
.zoomIn7 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:2.1s;
          animation-duration:2.1s;
}
.zoomIn8 {
  -webkit-animation-name: zoomIn;
          animation-name: zoomIn;
		   -webkit-animation-duration:2.4s;
          animation-duration:2.4s;
}

/*ZOOM*/








@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
            transform: translate3d(0, -100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
          animation-name: fadeInDown;
		   -webkit-animation-duration:1s;
          animation-duration:1s;
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
            transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
		  -webkit-animation-duration:1s;
          animation-duration:1s;
}