@charset "UTF-8";
/* CSS Document */

/*************************
*******ANIMATIONS******
**************************/


#main-slider .active .animation.animated-item-1 {
  -webkit-animation: fadeInUp 1s linear 600ms both;
  -moz-animation: fadeInUp 1s linear 300ms both;
  -o-animation: fadeInUp 1s linear 300ms both;
  -ms-animation: fadeInUp 1s linear 300ms both;
  animation: fadeInUp 1s linear 600ms both;
}

#main-slider .active .animation.animated-item-2 {
  -webkit-animation: fadeInUp 300ms linear 600ms both;
  -moz-animation: fadeInUp 300ms linear 600ms both;
  -o-animation: fadeInUp 300ms linear 600ms both;
  -ms-animation: fadeInUp 300ms linear 600ms both;
  animation: fadeInUp 300ms linear 600ms both;
}

#main-slider .active .animation.animated-item-3 {
  -webkit-animation: fadeInUp 300ms linear 900ms both;
  -moz-animation: fadeInUp 300ms linear 900ms both;
  -o-animation: fadeInUp 300ms linear 900ms both;
  -ms-animation: fadeInUp 300ms linear 900ms both;
  animation: fadeInUp 300ms linear 900ms both;
}

#main-slider .active .animation.animated-item-4 {
  -webkit-animation: fadeInUp 300ms linear 1200ms both;
  -moz-animation: fadeInUp 300ms linear 1200ms both;
  -o-animation: fadeInUp 300ms linear 1200ms both;
  -ms-animation: fadeInUp 300ms linear 1200ms both;
  animation: fadeInUp 300ms linear 1200ms both;
}

#about-ee .active .animation.animated-item-1 {
  -webkit-animation: fadeInDown 300ms linear 600ms both;
  -moz-animation: fadeInDown 300ms linear 600ms both;
  -o-animation: fadeInDown 300ms linear 600ms both;
  -ms-animation: fadeInDown 300ms linear 600ms both;
  animation: fadeInDown 300ms linear 600ms both;
}

#about-ee .active .animation.animated-item-2 {
  -webkit-animation: fadeInLeft 1s linear 600ms both;
  -moz-animation: fadeInLeft 1s linear 600ms both;
  -o-animation: fadeInLeft 1s linear 600ms both;
  -ms-animation: fadeInLeft 1s linear 600ms both;
  animation: fadeInLeft 1s linear 600ms both;
}

#about-ee .active .animation.animated-item-3 {
  -webkit-animation: fadeInRight 1s linear 400ms both;
  -moz-animation: fadeInRight 1s linear 400ms both;
  -o-animation: fadeInRight 1s linear 400ms both;
  -ms-animation: fadeInRight 1s linear 400ms both;
  animation: fadeInRight 1s linear 400ms both;
}

#ourvision .active .animation.animated-item-1 {
  -webkit-animation: fadeInDown 300ms linear 600ms both;
  -moz-animation: fadeInDown 300ms linear 600ms both;
  -o-animation: fadeInDown 300ms linear 600ms both;
  -ms-animation: fadeInDown 300ms linear 600ms both;
  animation: fadeInDown 300ms linear 600ms both;
}

#ourvision .active .animation.animated-item-2 {
  -webkit-animation: fadeInLeft 1s linear 600ms both;
  -moz-animation: fadeInLeft 1s linear 600ms both;
  -o-animation: fadeInLeft 1s linear 600ms both;
  -ms-animation: fadeInLeft 1s linear 600ms both;
  animation: fadeInLeft 1s linear 600ms both;
}

#ourvision .active .animation.animated-item-3 {
  -webkit-animation: fadeInRight 1s linear 400ms both;
  -moz-animation: fadeInRight 1s linear 400ms both;
  -o-animation: fadeInRight 1s linear 400ms both;
  -ms-animation: fadeInRight 1s linear 400ms both;
  animation: fadeInRight 1s linear 400ms both;
}


#ourmission .active .animation.animated-item-1 {
  -webkit-animation: fadeInDown 300ms linear 600ms both;
  -moz-animation: fadeInDown 300ms linear 600ms both;
  -o-animation: fadeInDown 300ms linear 600ms both;
  -ms-animation: fadeInDown 300ms linear 600ms both;
  animation: fadeInDown 300ms linear 600ms both;
}

#ourmission .active .animation.animated-item-2 {
  -webkit-animation: fadeInLeft 1s linear 600ms both;
  -moz-animation: fadeInLeft 1s linear 600ms both;
  -o-animation: fadeInLeft 1s linear 600ms both;
  -ms-animation: fadeInLeft 1s linear 600ms both;
  animation: fadeInLeft 1s linear 600ms both;
}

#ourmission .active .animation.animated-item-3 {
  -webkit-animation: fadeInRight 1s linear 400ms both;
  -moz-animation: fadeInRight 1s linear 400ms both;
  -o-animation: fadeInRight 1s linear 400ms both;
  -ms-animation: fadeInRight 1s linear 400ms both;
  animation: fadeInRight 1s linear 400ms both;
}


#projects .active .animation.animated-item-1 {
  -webkit-animation: fadeInDown 300ms linear 600ms both;
  -moz-animation: fadeInDown 300ms linear 600ms both;
  -o-animation: fadeInDown 300ms linear 600ms both;
  -ms-animation: fadeInDown 300ms linear 600ms both;
  animation: fadeInDown 300ms linear 600ms both;
}

#projects .active .animation.animated-item-2 {
  -webkit-animation: fadeInLeft 1s linear 600ms both;
  -moz-animation: fadeInLeft 1s linear 600ms both;
  -o-animation: fadeInLeft 1s linear 600ms both;
  -ms-animation: fadeInLeft 1s linear 600ms both;
  animation: fadeInLeft 1s linear 600ms both;
}

#projects .active .animation.animated-item-3 {
  -webkit-animation: fadeInRight 1s linear 400ms both;
  -moz-animation: fadeInRight 1s linear 400ms both;
  -o-animation: fadeInRight 1s linear 400ms both;
  -ms-animation: fadeInRight 1s linear 400ms both;
  animation: fadeInRight 1s linear 400ms both;
}

#nextgoal .active .animation.animated-item-1 {
  -webkit-animation: fadeInDown 1s linear 2s both;
  -moz-animation: fadeInDown 1s linear 2s both;
  -o-animation: fadeInDown 1s linear 2s both;
  -ms-animation: fadeInDown 1s linear 2s both;
  animation: fadeInDown 1s linear 2s both;
}

#nextgoal .active .animation.animated-item-2 {
  -webkit-animation: fadeInUp 1s linear 1s both;
  -moz-animation: fadeInUp 1s linear 1s both;
  -o-animation: fadeInUp 1s linear 1s both;
  -ms-animation: fadeInUp 1s linear 1s both;
  animation: fadeInUp 1s linear 2s both;
}


#nextgoal .active .animation.animated-item-3 {
  -webkit-animation: fadeInUp 1s linear 1s both;
  -moz-animation: fadeInUp 1s linear 1s both;
  -o-animation: fadeInUp 1s linear 1s both;
  -ms-animation: fadeInUp 1s linear 1s both;
  animation: fadeInUp 1s linear 3s both;
}


#nextgoal .active .animation.animated-item-4 {
  -webkit-animation: fadeInUp 1s linear 1s both;
  -moz-animation: fadeInUp 1s linear 1s both;
  -o-animation: fadeInUp 1s linear 1s both;
  -ms-animation: fadeInUp 1s linear 1s both;
  animation: fadeInUp 1s linear 4s both;
}


#ceo .active .animation.animated-item-1 {
  -webkit-animation: fadeInDown 300ms linear 300ms both;
  -moz-animation: fadeInDown 300ms linear 300ms both;
  -o-animation: fadeInDown 300ms linear 300ms both;
  -ms-animation: fadeInDown 300ms linear 300ms both;
  animation: fadeInDown 300ms linear 300ms both;
}

#contact .active .animation.animated-item-1 {
  -webkit-animation: fadeInDown 300ms linear 300ms both;
  -moz-animation: fadeInDown 300ms linear 300ms both;
  -o-animation: fadeInDown 300ms linear 300ms both;
  -ms-animation: fadeInDown 300ms linear 300ms both;
  animation: fadeInDown 300ms linear 300ms both;
}

.fade {
  opacity: 0;
}

@keyframes backgroundanimation {
	0% {
    transform: translate(0);
  }
  100% {
    transform: translate(-50px); /* The image width */
  }
}

.testfadeDown:not(.show) {
	opacity: 0;
}

.scrolling-image-container {
  overflow: hidden;
}

.scrolling-image {
  background: url("images/C-banner.png") repeat-x;
  height: 750px;
  width: 1250px;
	  animation: backgroundanimation 12s linear infinite alternate;
}

/* 
Define this in your CSS 
.ease-in-outAnimation = Replace it by the name you want to give your animation
.easeinoutAnimObj = Assign this class to the elements to which you want to apply the animation
*/

.easeinoutAnimObj {
	position: relative;
	/* Chrome, Safari*/
	-webkit-animation-name: ease-in-outAnimation;
	-webkit-animation-duration: 5s;
	-webkit-animation-timing-function: ease-in-out;
	-webkit-animation-delay: 2s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: alternate;
	-webkit-animation-play-state: running;
	/* Mozilla */
	-moz-animation-name: ease-in-outAnimation;
	-moz-animation-duration: 5s;
	-moz-animation-timing-function: ease-in-out;
	-moz-animation-delay: 2s;
	-moz-animation-iteration-count: infinite;
	-moz-animation-direction: alternate;
	-moz-animation-play-state: running;	
	/* Standard syntax */
	animation-name: ease-in-outAnimation;
	animation-duration: 5s;
	animation-timing-function: ease-in-out;
	animation-delay: 2s;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-play-state: running;
}

/* 
Define the keyframe and changes
*/

/* Chrome, Safari */
@-webkit-keyframes ease-in-outAnimation {
	0% {
		left: 0;
		top: 0;
	}
	100% {
		left: 200px;
		top: 0;
	}
}

/* Firefox */
@-moz-keyframes ease-in-outAnimation {
	0% {
		left: 0;
		top: 0;
	}
	100% {
		left: 200px;
		top: 0;
	}
}

/* Standard syntax */
@keyframes ease-in-outAnimation {
	0% {
		left: 0;
		top: 0;
	}
	100% {
		left: 200px;
		top: 0;
	}
}



