/* font start here */
/* font end here */

/*  smooth animation start here */
.hoverColor, .postImage, input[type="submit"], .mobileMenu{
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.slideContent{-webkit-transition: all 0.8s cubic-bezier(.16,.84,.44,1);
-moz-transition: all 0.8s cubic-bezier(.16,.84,.44,1);
-o-transition: all 0.8s cubic-bezier(.16,.84,.44,1);
transition: all 0.8s cubic-bezier(.16,.84,.44,1);
transition-delay: 0.2s;}

.animateclassName, .contactPopup, #overlay{
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}

/*  smooth animation end here */

/* common page animations */
.fadeIn {
	opacity: 0;
	transition: opacity .8s ease-in-out;
	-webkit-transition: opacity .8s ease-in-out;
	-moz-transition: opacity .8s ease-in-out;
	-o-transition: opacity .8s ease-in-out;
}

.fadeIn.animateMe {opacity:1}

.fadeInUp { -webkit-transform : translate3d(0, 30px, 0); -webkit-moz : translate3d(0, 30px, 0); transform : translate3d(0, 30px, 0); opacity:0; transition: opacity .8s ease-in-out, transform .8s ease-in-out;
 -webkit-transition: opacity .8s ease-in-out, transform .8s ease-in-out;
 -moz-transition: opacity .8s ease-in-out, transform .8s ease-in-out;
 -o-transition: opacity .8s ease-in-out, transform .8s ease-in-out;
}
.fadeInUp.animateMe { -webkit-transform : translate3d(0, 0, 0); -moz-transform : translate3d(0, 0, 0); transform : translate3d(0, 0, 0); opacity:1 }
/* common page animations */

/* 404 animation start */
@-webkit-keyframes balance {0% {-webkit-transform: translate3d(0,0,0); } 50% {-webkit-transform: translate3d(0,1rem,0); } 100% { -webkit-transform: translate3d(0,0,0); }}
@-moz-keyframes balance {0% {-moz-transform: translate3d(0,0,0);} 50% {-moz-transform: translate3d(0,1rem,0);} 100% {-moz-transform: translate3d(0,0,0);}}
@-o-keyframes balance {0% {-o-transform: translate3d(0,0,0);} 50% {-o-transform: translate3d(0,1rem,0);} 100% {-o-transform: translate3d(0,0,0);}}
@-ms-keyframes balance {0% {-ms-transform: translate3d(0,0,0); } 50% {-ms-transform: translate3d(0,1rem,0);}100% {-ms-transform: translate3d(0,0,0); }}
@keyframes balance {0% {transform: translate3d(0,0,0); } 50% {transform: translate3d(0,1rem,0); } 100% {transform: translate3d(0,0,0); }}
/* 404 animation end here */

/* home animations start here */
.homeFishOne, .homeFishTwo, .homeFishThree{ opacity: 0;}
.homeCamera{ top:-100%;}
.homeFishOne{left:2%; top:28%;}
.homeFishTwo{right:11%; top:9%;}
.homeFishThree{ left:42%; bottom:18%;}

.homeBanner.animateMe .homeCamera{
  -webkit-animation: homeCamera 2s ease-in-out forwards;
  -moz-animation: homeCamera 2s ease-in-out forwards;
  -ms-animation: homeCamera 2s ease-in-out forwards;
  animation: homeCamera 2s ease-in-out forwards;
  animation-delay:0.5s;
}
.homeBanner.animateMe .homeFishOne{
  -webkit-animation: homeFishOne 0.5s ease-in-out forwards;
  -moz-animation: homeFishOne 0.5s ease-in-out forwards;
  -ms-animation: homeFishOne 0.5s ease-in-out forwards;
  animation: homeFishOne 0.5s ease-in-out forwards;
  animation-delay:1.8s;
}
.homeBanner.animateMe .homeFishTwo{
  -webkit-animation: homeFishTwo 0.5s ease-in-out forwards;
  -moz-animation: homeFishTwo 0.5s ease-in-out forwards;
  -ms-animation: homeFishTwo 0.5s ease-in-out forwards;
  animation: homeFishTwo 0.5s ease-in-out forwards;
  animation-delay:2.4s;
}
.homeBanner.animateMe .homeFishThree{
  -webkit-animation: homeFishThree 0.5s ease-in-out forwards;
  -moz-animation: homeFishThree 0.5s ease-in-out forwards;
  -ms-animation: homeFishThree 0.5s ease-in-out forwards;
  animation: homeFishThree 0.5s ease-in-out forwards;
  animation-delay:2.9s;
}

  @keyframes homeCamera {
    0%{top:-100%;}
    100%{top:0;}
  }
  @-webkit-keyframes homeCamera {
    0%{top:-100%;}
    100%{top:0;}
  }

@keyframes homeFishOne {
  0%{opacity:0; visibility:hidden; left:2%; top:28%;}
  100%{opacity: 1; visibility:visible; left:4%; top:30%;}
}
@-webkit-keyframes homeFishOne {
  0%{opacity:0; visibility: hidden; left:2%; top:28%;}
  100%{opacity: 1; visibility: visible; left: 4%; top:30%;}
}

@keyframes homeFishTwo {
  0%{opacity:0; visibility:hidden; right:11%; top:9%;}
  100%{opacity:1; visibility:visible; right:13%; top:11%;}
}
@-webkit-keyframes homeFishTwo {
  0%{opacity:0; visibility:hidden; right:11%; top:9%;}
  100%{opacity:1; visibility:visible; right:13%; top:11%;}
}

@keyframes homeFishThree {
  0%{opacity:0; visibility:hidden; left:46%; bottom:10%;}
  100%{opacity:1; visibility:visible; left:44%; bottom:12%;}
}
@-webkit-keyframes homeFishThree {
  0%{opacity:0; visibility:hidden; left:46%; bottom:10%;}
  100%{opacity:1; visibility:visible; left:44%; bottom:12%;}
}

.homeBottomFish.animateMe{
  -webkit-animation: homeBottomFish 0.5s ease-in-out forwards;
  -moz-animation: homeBottomFish 0.5s ease-in-out forwards;
  -ms-animation: homeBottomFish 0.5s ease-in-out forwards;
  animation: homeBottomFish 0.5s ease-in-out forwards;
  animation-delay:0.8s;
  bottom:0%; right:22%; opacity: 0;

}

@keyframes homeBottomFish {
  0%{opacity:0; visibility:hidden; bottom:0%; right:22%;}
  100%{opacity:1; visibility:visible; bottom:2%; right:20%;}
}
@-webkit-keyframes homeBottomFish {
  0%{opacity:0; visibility:hidden; bottom:0%; right:22%;  }
  100%{opacity:1; visibility:visible; bottom:2%; right:20%;}
}

.homeMobile.animateMe .techmobile, .respMobileholder.animateMe .techmobile{
  -webkit-animation: techmobile 1s ease-in-out forwards;
  -moz-animation: techmobile 1s ease-in-out forwards;
  -ms-animation: techmobile 1s ease-in-out forwards;
  animation: techmobile 1s ease-in-out forwards;
  animation-delay:0.5s; margin-right: -10%;
   opacity:0;}

  @keyframes techmobile {
    0%{opacity:0; visibility:hidden; margin-right: -10%;}
    100%{opacity:1; visibility:visible; margin-right:0}
  }
  @-webkit-keyframes techmobile {
    0%{opacity:0; visibility:hidden; margin-right: -10%;}
    100%{opacity:1; visibility:visible; margin-right:0}
  }
/* home animations end here */

/* banner fish animations start here */
.blogHero .fishOne{opacity:0; right: 24%; bottom:14%;}
.blogHero.animateMe .fishOne{
  -webkit-animation: showNewsFish 1s ease-in-out forwards;
  -moz-animation: showNewsFish 1s ease-in-out forwards;
  -ms-animation: showNewsFish 1s ease-in-out forwards;
  animation: showNewsFish 1s ease-in-out forwards;
  animation-delay:1s;}

@keyframes showNewsFish {
  0%{opacity:0; visibility: hidden; right:22%; bottom:14%;}
  100%{opacity: 1; visibility: visible; right:24%; bottom:16%;}
}
@-webkit-keyframes showNewsFish {
  0%{opacity:0; visibility: hidden; right:22%; bottom:14%;}
  100%{opacity: 1; visibility: visible; right:24%; bottom:16%;}
}

.careerHero .fishOne, .careerHero .fishTwo, .careerHero .tower{opacity:0;}
.careerHero .fishOne{right:24%; top:5%;}
.careerHero .fishTwo{left:38%; bottom:18%;}
.careerHero .tower{right:26%; bottom:-2%;}
.careerHero.animateMe .fishOne{
  -webkit-animation: showCareerFishone 1s ease-in-out forwards;
  -moz-animation: showCareerFishone 1s ease-in-out forwards;
  -ms-animation: showCareerFishone 1s ease-in-out forwards;
  animation: showCareerFishone 1s ease-in-out forwards;
  animation-delay:1s;
}
.careerHero.animateMe .fishTwo{
  -webkit-animation: showCareerFishtwo 1s ease-in-out forwards;
  -moz-animation: showCareerFishtwo 1s ease-in-out forwards;
  -ms-animation: showCareerFishtwo 1s ease-in-out forwards;
  animation: showCareerFishtwo 1s ease-in-out forwards;
  animation-delay:1.5s;
}
.careerHero.animateMe .tower{
  -webkit-animation: showCareerTower 1s ease-in-out forwards;
  -moz-animation: showCareerTower 1s ease-in-out forwards;
  -ms-animation: showCareerTower 1s ease-in-out forwards;
  animation: showCareerTower 1s ease-in-out forwards;
  animation-delay:1.8s;
}

  @keyframes showCareerFishone {
    0%{opacity:0; visibility:hidden; right:24%; top:5%;}
    100%{opacity:1; visibility:visible; right:26%; top:4%;}
  }
  @-webkit-keyframes showCareerFishone {
    0%{opacity:0; visibility:hidden; right:24%; top:5%;}
    100%{opacity:1; visibility:visible; right:26%; top:4%;}
  }

  @keyframes showCareerFishtwo {
    0%{opacity:0; visibility:hidden; left:38%; bottom:18%;}
    100%{opacity:1; visibility:visible; left:42%; bottom:16%;}
  }
  @-webkit-keyframes showCareerFishtwo {
    0%{opacity:0; visibility:hidden; left:38%; bottom:18%;}
    100%{opacity:1; visibility:visible; left:42%; bottom:16%;}
  }

  @keyframes showCareerTower {
    0%{opacity:0; visibility:hidden; right:26%; bottom:-2%;}
    100%{opacity:1; visibility:visible; right:26%; bottom:0;}
  }
  @-webkit-keyframes showCareerTower {
    0%{opacity:0; visibility:hidden; right:26%; bottom:-2%;}
    100%{opacity:1; visibility:visible; right:26%; bottom:0;}
  }
/* banner fish animations end here */

/* company page animate start*/
.textOnImageBlock .mobileDisplay{ opacity: 0; top:10%;}
.textOnImageBlock .cameraImage{ top:-100%;}
.textOnImageBlock.animateMe .cameraImage{
  -webkit-animation: cameraImage 2s ease-in-out forwards;
  -moz-animation: cameraImage 2s ease-in-out forwards;
  -ms-animation: cameraImage 2s ease-in-out forwards;
  animation: cameraImage 2s ease-in-out forwards;
  animation-delay:0.4s;
}
.textOnImageBlock.animateMe .mobileDisplay{
  -webkit-animation: mobileDisplay 0.8s ease-in-out forwards;
  -moz-animation: mobileDisplay 0.8s ease-in-out forwards;
  -ms-animation: mobileDisplay 0.8s ease-in-out forwards;
  animation: mobileDisplay 0.8s ease-in-out forwards;
  animation-delay:1s;
}
  @keyframes cameraImage {
    0%{top:-100%}
    100%{top:-3%}
  }
  @-webkit-keyframes cameraImage {
    0%{top:-100%}
    100%{top:-3%}
  }

  @keyframes mobileDisplay {
    0%{opacity:0; visibility:hidden; top:10%}
    100%{opacity:1; visibility:visible; top:-20%}
  }
  @-webkit-keyframes mobileDisplay {
    0%{opacity:0; visibility:hidden; top:10%}
    100%{opacity:1; visibility:visible; top:-20%}
  }
/* company page animate end*/

/* techHero animate start*/
.techHero .techFishOne,
.techHero .techFishTwo,
.techHero .techFishThree,
.techHero .techBannerMobile{opacity:0;}

.techHero .techBannerMobile{bottom:6%;}
.techHero .techCamera{top:-100%;}
.techHero .techFishOne{right:38%; top:54%;}
.techHero .techFishTwo{right:-2%; top:50%;}
.techHero .techFishThree{right:10%; top:72%;}

.techHero.animateMe .techBannerMobile{
  -webkit-animation: techBannerMobile 0.8s ease-in-out forwards;
  -moz-animation: techBannerMobile 0.8s ease-in-out forwards;
  -ms-animation: techBannerMobile 0.8s ease-in-out forwards;
  animation: techBannerMobile 0.8s ease-in-out forwards;
  animation-delay:0.5s;
}
.techHero.animateMe .techCamera{
  -webkit-animation: techCamera 2s ease-in-out forwards;
  -moz-animation: techCamera 2s ease-in-out forwards;
  -ms-animation: techCamera 2s ease-in-out forwards;
  animation: techCamera 2s ease-in-out forwards;
  animation-delay:0.8s;
}
.techHero.animateMe .techFishOne{
  -webkit-animation: techFishOne 1s ease-in-out forwards;
  -moz-animation: techFishOne 1s ease-in-out forwards;
  -ms-animation: techFishOne 1s ease-in-out forwards;
  animation: techFishOne 1s ease-in-out forwards;
  animation-delay:1.5s;
}
.techHero.animateMe .techFishTwo{
  -webkit-animation: techFishTwo 1s ease-in-out forwards;
  -moz-animation: techFishTwo 1s ease-in-out forwards;
  -ms-animation: techFishTwo 1s ease-in-out forwards;
  animation: techFishTwo 1s ease-in-out forwards;
  animation-delay:1.8s;
}
.techHero.animateMe .techFishThree{
  -webkit-animation: techFishThree 1s ease-in-out forwards;
  -moz-animation: techFishThree 1s ease-in-out forwards;
  -ms-animation: techFishThree 1s ease-in-out forwards;
  animation: techFishThree 1s ease-in-out forwards;
  animation-delay:2s;
}

  @keyframes techBannerMobile {
    0%{opacity:0; visibility:hidden; bottom:6%;}
    100%{opacity:1; visibility:visible; bottom:10%}
  }
  @-webkit-keyframes techBannerMobile {
    0%{opacity:0; visibility:hidden; bottom:6%;}
    100%{opacity:1; visibility:visible; bottom:10%}
  }

  @keyframes techCamera {
    0%{opacity:0; visibility:hidden; top:-100%;}
    100%{opacity:1; visibility:visible; top:0;}
  }
  @-webkit-keyframes techCamera {
    0%{opacity:0; visibility:hidden; top:-100%;}
    100%{opacity:1; visibility:visible; top:0;}
  }

  @keyframes techFishOne {
    0%{opacity:0; visibility:hidden; right:38%; top:54%;}
    100%{opacity:1; visibility:visible; right:36%; top:56%;}
  }
  @-webkit-keyframes techFishOne {
    0%{opacity:0; visibility:hidden; right:38%; top:54%;}
    100%{opacity:1; visibility:visible; right:36%; top:56%;}
  }

  @keyframes techFishTwo {
    0%{opacity:0; visibility:hidden; right:-2%; top:50%;}
    100%{opacity:1; visibility:visible; right:0%; top:48%;}
  }
  @-webkit-keyframes techFishTwo {
    0%{opacity:0; visibility:hidden; right:-2%; top:50%;}
    100%{opacity:1; visibility:visible; right:0%; top:48%;}
  }

  @keyframes techFishThree {
    0%{opacity:0; visibility:hidden; right:10%; top:72%;}
    100%{opacity:1; visibility:visible; right:8%; top:74%;}
  }
  @-webkit-keyframes techFishThree {
    0%{opacity:0; visibility:hidden; right:10%; top:72%;}
    100%{opacity:1; visibility:visible; right:8%; top:74%;}
  }

  .cameraInfo .theCamera{right:-12%; top:0; opacity:0;}
  .cameraInfo.animateMe .theCamera{
    -webkit-animation: theCamera 1s ease-in-out forwards;
    -moz-animation: theCamera 1s ease-in-out forwards;
    -ms-animation: theCamera 1s ease-in-out forwards;
    animation: theCamera 1s ease-in-out forwards;
    animation-delay:0.5s;
  }

    @keyframes theCamera {
      0%{opacity:0; visibility:hidden; right:-12%; top:0;}
      100%{opacity:1; visibility:visible; right: 0; top:0;}
    }
    @-webkit-keyframes theCamera {
      0%{opacity:0; visibility:hidden; right:-12%; top:0;}
      100%{opacity:1; visibility:visible; right: 0; top:0;}
    }
/* techHero animate end*/

@media screen and (min-width: 0px) and (max-width:1200px) {
  @keyframes showNewsFish {
    0%{opacity:0; visibility: hidden; right:20%; bottom:10%;}
    100%{opacity: 1; visibility: visible; right:22%; bottom:12%;}
  }
  @-webkit-keyframes showNewsFish {
    0%{opacity:0; visibility: hidden; right:20%; bottom:10%;}
    100%{opacity: 1; visibility: visible; right:22%; bottom:12%;}
  }
}

@media screen and (min-width: 0px) and (max-width: 896px) {
@media all and (orientation: portrait){

  @keyframes homeFishOne {
    0%{opacity:0; visibility:hidden; left:auto; right:14%; top:24%;}
    100%{opacity: 1; visibility:visible; left:auto; right:12%; top:26%;}
  }
  @-webkit-keyframes homeFishOne {
    0%{opacity:0; visibility:hidden; left:auto; right:14%; top:24%;}
    100%{opacity: 1; visibility:visible; left:auto; right:12%; top:26%;}
  }

  @keyframes homeFishThree {
    0%{opacity:0; visibility:hidden; left:0; right:0; bottom:22%;}
    100%{opacity:1; visibility:visible; left:0; right:0; bottom:24%;}
  }
  @-webkit-keyframes homeFishThree {
    0%{opacity:0; visibility:hidden; left:0; right: 0; bottom:22%;}
    100%{opacity:1; visibility:visible; left:0; right: 0; bottom:24%;}
  }

  .blogHero .fishOne{opacity:0; right: 8%; bottom:6%;}
  @keyframes showNewsFish {
    0%{opacity:0; visibility: hidden; right:12%; bottom:-2%;}
    100%{opacity: 1; visibility: visible; right:14%; bottom:0%;}
  }
  @-webkit-keyframes showNewsFish {
    0%{opacity:0; visibility: hidden; right:12%; bottom:-2%;}
    100%{opacity: 1; visibility: visible; right:14%; bottom:0%;}
  }

}
}

@media screen and (min-width: 0px) and (max-width:767px){
  @keyframes techBannerMobile {
    0%{opacity:0; visibility:hidden; bottom:2%;}
    100%{opacity:1; visibility:visible; bottom:6%}
  }
  @-webkit-keyframes techBannerMobile {
    0%{opacity:0; visibility:hidden; bottom:2%;}
    100%{opacity:1; visibility:visible; bottom:6%}
  }

  @keyframes techFishOne {
    0%{opacity:0; visibility:hidden; right:38%; top:auto; bottom:28%;}
    100%{opacity:1; visibility:visible; right:36%; top:auto; bottom:26%;}
  }
  @-webkit-keyframes techFishOne {
    0%{opacity:0; visibility:hidden; right:38%; top:auto; bottom:28%;}
    100%{opacity:1; visibility:visible; right:36%; top:auto; bottom:26%;}
  }

  @keyframes techFishTwo {
    0%{opacity:0; visibility:hidden; right:2%; top:auto; bottom:16%;}
    100%{opacity:1; visibility:visible; right:0%; top:auto; bottom:14%;}
  }
  @-webkit-keyframes techFishTwo {
    0%{opacity:0; visibility:hidden; right:2%; top:auto; bottom:16%;}
    100%{opacity:1; visibility:visible; right:0%; top:auto; bottom:14%;}
  }

}

@media screen and (min-width: 0px) and (max-width:640px){
@keyframes showCareerTower {
  0%{opacity:0; visibility:hidden; right:22%; bottom:-2%;}
  100%{opacity:1; visibility:visible; right:22%; bottom:0;}
}
@-webkit-keyframes showCareerTower {
  0%{opacity:0; visibility:hidden; right:22%; bottom:-2%;}
  100%{opacity:1; visibility:visible; right:22%; bottom:0;}
}

@keyframes mobileDisplay {
  0%{opacity:0; visibility:hidden; top:auto; bottom:-10%;}
  100%{opacity:1; visibility:visible; top:auto; bottom:0;}
}
@-webkit-keyframes mobileDisplay {
  0%{opacity:0; visibility:hidden; top:auto; bottom:-10%;}
  100%{opacity:1; visibility:visible; top:auto; bottom:0;}
}

}


@media screen and (min-width:320px) and (max-width: 428px) {
@media all and (orientation: portrait){

  @keyframes homeFishOne {
    0%{opacity:0; visibility:hidden; left:auto; right:14%; top:18%;}
    100%{opacity: 1; visibility:visible; left:auto; right:12%; top:20%;}
  }
  @-webkit-keyframes homeFishOne {
    0%{opacity:0; visibility:hidden; left:auto; right:14%; top:18%;}
    100%{opacity: 1; visibility:visible; left:auto; right:12%; top:20%;}
  }

  @keyframes homeFishThree {
    0%{opacity:0; visibility:hidden; left:0; right:0; bottom:30%;}
    100%{opacity:1; visibility:visible; left:0; right:0; bottom:32%;}
  }
  @-webkit-keyframes homeFishThree {
    0%{opacity:0; visibility:hidden; left:0; right: 0; bottom:30%;}
    100%{opacity:1; visibility:visible; left:0; right: 0; bottom:32%;}
  }

  @keyframes showNewsFish {
    0%{opacity:0; visibility: hidden; right:8%; bottom:-4%;}
    100%{opacity: 1; visibility: visible; right:10%; bottom:-2%;}
  }
  @-webkit-keyframes showNewsFish {
    0%{opacity:0; visibility: hidden; right:8%; bottom:-4%;}
    100%{opacity: 1; visibility: visible; right:10%; bottom:-2%;}
  }

}}
