

  .parallax {
    position: relative;
    z-index:0;
    height: 500px; /* fallback for older browsers */
    height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
  }

  .parallax__group {
    position: relative;
    height: 450px; /* fallback for older browsers */
    height: 67vh;
  }

  .parallax__group__fullscreen {
    position: relative;
    height: 750px; /* fallback for older browsers */
    height: 100vh;
  }

  .parallax__group__scrollscreen {
    position: relative;
  }

  .parallax__layer {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
  }

  .parallax__layer--fore {
    z-index: 2;
  }

  .parallax__layer--base {
    z-index: 1;
  }

  .parallax__layer--back {
    z-index: 0;
  }

  .parallax__layer--deep {
    z-index: -1;
  }

  #group2 > .parallax__layer--back {
    background-color: rgb(150, 180, 255)
  }


  /* demo styles
  --------------------------------------------- */

  body, html {
    overflow: hidden;
    font-family: 'Scada';
    sans-serif;
    color:#000044;
    font-size: 100%;
    font-size: 2.75vh;
  }

  * {
    margin:0;
  /*  padding:0; */
  }

  .parallax, a, input, textarea {
    pointer-events:auto;
  }

  .parallax {
    font-size: 200%;
  }

   /* centre the content in the parallax layers */
  .title {
    text-align: center;
    position: absolute;
    width:100%;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }

   /* for big pages go simpler */
  .scroll {
    padding: 20vh 0vw;
    font-size: 150%;
    /* text-align: center; */
    /* position: absolute; */
    /* width:100%; */
    /* left: 50%; */
    /* top: 50%; */
    /* -webkit-transform: translate(-50%, -50%); */
    /* transform: translate(-50%, -50%); */
  }
  
  div.lots-of-text {
    font-size:65%;
  }
  
  .full-height {
    height:100%;
  }
  
  .full-width {
    width:100%;
  }
  
  .fixed {
    position:absolute;
    left:0px;
    top:0px;
  }
  
  div.cols.three {
    width: 33%;
    display: inline-block;
    font-size: 60%;
    font-size: 5vw;
  }
  
  div.cols.unselected {
    opacity:0.5;
  }
  
  div.cols > p {
    margin: 0; 
    padding: 0; 
    font-size:100%; 
    text-align:center;
  }
  
  .bg-icon.fa.fa-circle, .bg-icon.fa.fa-circle-o {
    position: absolute;
    width: 33%;
    z-index: -1;
    color: rgb(150,180,255);
    font-size:125%;
  }
  
  .first.three > a > .bg-icon {
    left: 0%;
  }
  
  .second.three > a > .bg-icon {
    left: 33%;
  }
  
  .third.three > a > .bg-icon {
    left: 66%;
  }
  
  div.small-logo-container{
    width: 50%;
    position: absolute;
    top:  3vh;
    right: 5%;
    margin-right: 0;
  }



  /* style the groups
  --------------------------------------------- */

  #group1 {
    z-index: 50;
  }
  #group1 .parallax__layer--base {
    background: rgb(250,245,255);
  }

  #group2 {
    z-index: 20;
  }
  #group2 .parallax__layer--back {
    background: rgb(150,150,255);
  }

  #group3 {
    z-index: 40;
  }
  #group3 .parallax__layer--base {
    background: rgb(245,250,255);
  }

  #group4 {
    z-index: 10;
  }
  #group4 .parallax__layer--deep {
    background: rgb(184,223,101);
  }

  #group5 {
    z-index: 40;
  }
  #group5 .parallax__layer--base {
    background: rgb(250,245,255);
  }

  #group6 {
    z-index: 20;
  }
  #group6 .parallax__layer--back {
    background: rgb(245,235,100);
  }

  #group7 {
    z-index: 30;
  }
  #group7 .parallax__layer--base {
    background: rgb(245,250,255);
  }


  /* misc
  --------------------------------------------- */
  .footer__info {
    background:rgba(255,255,255,0.75);
    padding:0.5em;
  }
  
  .footer {
    position: absolute;
    z-index: 100;
    bottom: 0;
    left: 0;
    right:0;
    font-size: 65%;
    text-align: center;
    width: 100%;
  }
  
  div.light-text-on-dark{
    background:rgba(0,0,0,0.6);
    color:white;
  }
  
  div.light-text-on-dark a {
    color:rgb(150, 180, 255);
  }
  
  div.hidable {
    /* display: inline-block; */
    /* position: relative; */
    width: 100%;
    position: absolute;
    left: 0;
  }
  
  div.hidable.hidden {
    /* left: -100%; */
    /* width: 0; */
    visibility: hidden;
    display: none;
  }
  
  div.hidable.shown {
    visibility: visible;
    display: block;
    /* left: 0%; */
    /* width: 96%; */
    /* overflow-x: hidden; */
  }
  
  div.title.non-blurry {
    /* -webkit-transform: translate3d(-50%,-50%,0);
    transform: translate3d(-50%,-50%,0); */
    /* -webkit-font-smoothing: antialiased;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0) perspective(1px) translate(-50%, -50%);
    filter: blur(0);
    -webkit-filter: blur(0); */
  }
  
  div.check-icons {
    padding:1vw;
  }
  
  div.check-icons i.fa.fa-check {
    visibility:hidden;
  }
  
  div.check-icons i.fa.fa-check.lvl0 {
    visibility:visible;
  }
  
  .hide-if-portrait + i.fa.fa-check {
    opacity:0.75;
  }
  
  @media screen and (orientation:portrait) {
  
    div.lots-of-text {
      font-size:60%;
    }
  
    .hide-if-portrait{
       display:none;
    }
    
    .hide-if-portrait + i.fa.fa-check {
       margin-left: 1em;
    }
  }
  @media screen and (orientation:landscape) {
    div.lots-of-text {
      font-size:70%;
    }
  
    .hide-if-portrait + i.fa.fa-check {
      position: relative;
      left: -0.7em;
    }
  }
  
  img.clip_to_img {
    position: absolute;
    left: 0;
    top: 0;
    /* clip: rect(70px,1250px,350px,60px); */
  }

  /* for square and portrait */
  @media screen and (max-aspect-ratio: 947/537) {
    .cloud_img {
      width:auto;
      height:69%;
      min-height:69%;
      height:69vh;
    }
    .nebula_img {
      width:auto;
      height:69%;
      min-height:69%;
      height:69vh;
    }
  }

  /* for very landscape */
  @media screen and (min-aspect-ratio: 947/537) {
    .cloud_img {
       width:100%;
       min-width:100%;
       width:100vw;
       height:auto;
    }
    .nebula_img {
       width:100%;
       min-width:100%;
       width:100vw;
       height:auto;
    }
  }

@supports (((perspective: 1px) or (perspective: 1)) and (not (-webkit-overflow-scrolling: touch))) {

  * {
    pointer-events:none;          /* THIS IS THE TRICK YOU SEEK */
  }

  /* Parallax base styles
  --------------------------------------------- */

  .parallax {
    -webkit-perspective: 300px;
    perspective: 300px;
    -webkit-perspective-origin-x: 100%;
    perspective-origin-x: 100%;
  }

  .parallax__group {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }

  .parallax__layer {
    -webkit-transform-origin-x: 100%;
    transform-origin-x: 100%;
  }

  .parallax__layer--fore {
    -webkit-transform: translateZ(90px) scale(.7);
    transform: translateZ(90px) scale(.7, .6);
  }

  .parallax__layer--base {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }

  .parallax__layer--back {
    -webkit-transform: translateZ(-300px) scale(2);
    transform: translateZ(-300px) scale(2.1, 3);
  }

  .parallax__layer--deep {
    -webkit-transform: translateZ(-600px) scale(3);
    transform: translateZ(-600px) scale(3.15, 4.5);
  }

  .nebula_img {
    transform: scale(1.42, 1);
  }
  .deep_nebula_img {
    transform: scale(1, 0.6);
  }

}
/* end of supports block */

div.top_corner {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 26.7vh 20vw 0 0;
    border-color: rgba(150,180,255,0.50) transparent transparent transparent;
    line-height: 0px;
    _border-color: rgba(150,180,255,0.50) #000000 #000000 #000000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
 /*   border-style: inset; */
    -webkit-transform:rotate(360deg);
  }
  div.bottom_corner {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 26.7vh 20vw;
	border-color: transparent transparent rgba(150,180,255,0.50) transparent;
	line-height: 0px;
	_border-color: #000000 #000000 rgba(150,180,255,0.50) #000000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
 /*   border-style: inset; */
    -webkit-transform:rotate(360deg);
  }

  p, ul, ol {margin: 0 2vw; padding:1vw 0; font-size:75%; text-align:left}
  li {margin: 0 10vw;}
  h1 {margin: 0 2vw;
    padding: 2vw 0;
    font-size: 100%;
    text-align: left;
  }
  h2, h3, h4, h5, h6
  {
    margin: 0 2vw;
    padding: 2vw 0;
    font-size: 70%;
    text-align: left;
  }
  p.flyby {
    margin: 0 1vw; text-align:right;
  }
  div.flyby {
    background: rgba(150,180,255,0.9);
    position: absolute;
    right: 1vw;
    top:40vh;
  }
  div.flyby-lower {
    top:50vh;
  }
  
  div.inline {
    display:inline-block; 
    position:relative; 
    font-size:80%
  }
  
  div.inline > span {
    margin:0.5vh 3vw
  }
  div.lots-of-text div.inline > span {
    margin:0.5vh 1vw
  }
  
  div.inline a, div.headline a, div.unselected a, div#to_top {
    text-decoration : none;
    -webkit-transition: 0.5s;
    transition: 0.5s;
  }
  
  div.selected a:hover {
    cursor : default;
  }
  
  div.inline a:hover, div.headline a:hover, div.unselected a:hover, div#to_top:hover {
    cursor : pointer;
    color : rgb(140, 180, 255);
    text-shadow: 1px 1px 2px rgba(0,0,68,1);
  }
  
  .floating_fa.fa {
    font-size: 120%;
    position: absolute;
    top: -0.1em;
    left: 0.2em;
    z-index: -1;
    -ms-transform: rotate(25deg);
    -webkit-transform: rotate(25deg);
    transform: rotate(25deg);
    color: rgba(150,180,255,0.5);
  }
  .floating_fa.no_tilt.fa {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  
  .floating_fa.fa-mobile {
    font-size: 160%;
    top: -0.2em;
    left: 0.3em;
  }
  .floating_fa.fa-rocket, .fa-thumbs-o-up {
	-ms-transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  div.cloud {position:relative; width: 100% ;margin-left: auto ;margin-right: 15%; overflow:hidden}
  img.cloud {
    max-width:30%; margin-left: 10%;
    margin-top: 5%;
    opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */}
  div.headline {position:absolute; top:30%; width:100%}
  font.headline {font-size: 9vw; color:#000044; text-align:center}
  font.mini-headline {font-size: 4.5vw; color:#000044; text-align:center}
  
  div.page-heading-container {  
    position:absolute;
    left:5%;
    bottom:10%;
    width: 90%;
    text-align: center;
  }
  
  h1.page-heading {
    font-size:150%;
  }

  table {margin: 0 2vw; text-align:right; text-valign:middle; width:95%; width:95vw}
  tr {}
  td {pointer-events:auto; cursor:pointer; height:15vh;}
  td.left {width:40%; min-width:40%; max-width:45%; position:relative;}
  td.right {width:60%; min-width:55%; max-width:60%; position:relative;}
  div.text {position: absolute;
    bottom: 10%;
    right: 0;
    text-align: right;
    margin-right: 2vw;
    font-size: 65%;
    /* height: 100%; */
    max-width: 60%;
  }
  div.text_narrow {
    max-width: 40%;
  }
  div.image {
    max-width:30%; 
    height:100%; 
    height:14vh; 
    text-align:left; 
    margin-left:1vw;
  }
  div.image img {max-width:99%; max-height:80%; vertical-align:middle; margin-top:auto; margin-bottom:auto; vertical-align: middle;}
  div.big_image {
    width:100%; 
    height:100%; 
    text-align:right; 
    float:right; 
    margin-right:10px;
  }
  div.big_image img {
    position: absolute;
    right:1vw;
    bottom:1vw;
    /* height:90%; */
    max-height: 90%; 
    max-width: 90%; 
    margin-top:auto; 
    margin-bottom:auto; 
    vertical-align: middle;
  }
  div.images {max-width:60%; height:100%; text-align:left; margin-left:1vw;}
  div.images img {max-width:20%; width:5.5vw; vertical-align:middle; padding-right:1vw}
  .helper {
	    display: inline-block;
	    height: 100%;
	    vertical-align: middle;
  }


  #contact-area {
    display: inline-block;
	    text-align: right;
	    width: 65vh;
    vertical-align: top;
    font-size:75%;
  }

  form {
    margin-bottom: 1em;
  }

  #contact-area input, #contact-area textarea {
        padding: 0.5em;
		    width: 22em;
		    /* font-family: Helvetica, sans-serif; */
		    font-size: 50%;
		    margin: 0.5em 0em 0.5em 0em;
    border: 2px solid #ccc;
  }

  #contact-area textarea {
  	height: 16.5vh;
    resize: none;
  }

  #contact-area textarea:focus, #contact-area input:focus {
  	border: 2px solid #900;
  }

  form input.submit-button {
  	    width: 6em;
    /* float: right; */
  }

  #contact-area label {
    font-size: 75%;
    vertical-align: top;
    line-height: 2.3;
  }
  
  a:link, a:visited, a:hover, a:active {
      color: #000044;
  }
  
  /* Style The Dropdown Button */
  .dropbtn {
    background: none;
    outline: none;
    color: white;
    font: 20px 'Scada';
    width: 9em;
    text-align: left;
    padding: 1vh 1vw;
    border: none;
    cursor: pointer;
    pointer-events: auto;
  }
  
  /* The container <div> - needed to position the dropdown content */
  .dropdown {
      position: absolute;
      z-index: 10;
      display: inline-block;
      pointer-events: auto;
  }
  
  .dropdown_corner {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16vh 12vw 0 0;
    border-color: rgba(0,0,68,0.75) transparent transparent transparent;
    line-height: 0px;
    _border-color: rgba(0,0,68,0.75) #000000 #000000 #000000;
    _filter: progid:DXImageTransform.Microsoft.Chroma(color='#000000');
 /*   border-style: inset; */
    -webkit-transform:rotate(360deg);
  }
  
  /* Dropdown Content (Hidden by Default) */
  .dropdown-content {
      display: none;
    width: 100%;
      position: absolute;
    font: 20px 'Scada';
      background-color: rgba(249,249,249,0.9);
      box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  }
  
  /* Links inside the dropdown */
  .dropdown-content a {
      padding: 1vh 1vw;
      text-decoration: none;
      display: block;
  }
  
  /* Change color of dropdown links on hover */
  .dropdown-content a:hover {
    background-color: rgba(150,180,255,0.9);
  }
  
  /* Show the dropdown menu on hover */
  .dropdown:hover .dropdown-content {
      display: block;
  }
  
  .dropdown .btntext{
      display: none;
  }
  
  .dropdown:hover .btntext{
      display: inline;
  }
  
  /* Change the background color of the dropdown button when the dropdown content is shown */
  .dropdown:hover .dropbtn {
      color: rgb(150,180,255);
      background : #000044
  }
  
  /*!
   * font-awesome-animation - v0.0.9
   * https://github.com/l-lin/font-awesome-animation
   * License: MIT
 */
  @-webkit-keyframes ring{0%{-webkit-transform:rotate(-15deg);transform:rotate(-15deg)}2%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}4%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}6%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}8%{-webkit-transform:rotate(-22deg);transform:rotate(-22deg)}10%{-webkit-transform:rotate(22deg);transform:rotate(22deg)}12%{-webkit-transform:rotate(-18deg);transform:rotate(-18deg)}14%{-webkit-transform:rotate(18deg);transform:rotate(18deg)}16%{-webkit-transform:rotate(-12deg);transform:rotate(-12deg)}18%{-webkit-transform:rotate(12deg);transform:rotate(12deg)}100%,20%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}
  @keyframes ring{0%{-webkit-transform:rotate(-15deg);-ms-transform:rotate(-15deg);transform:rotate(-15deg)}2%{-webkit-transform:rotate(15deg);-ms-transform:rotate(15deg);transform:rotate(15deg)}4%{-webkit-transform:rotate(-18deg);-ms-transform:rotate(-18deg);transform:rotate(-18deg)}6%{-webkit-transform:rotate(18deg);-ms-transform:rotate(18deg);transform:rotate(18deg)}8%{-webkit-transform:rotate(-22deg);-ms-transform:rotate(-22deg);transform:rotate(-22deg)}10%{-webkit-transform:rotate(22deg);-ms-transform:rotate(22deg);transform:rotate(22deg)}12%{-webkit-transform:rotate(-18deg);-ms-transform:rotate(-18deg);transform:rotate(-18deg)}14%{-webkit-transform:rotate(18deg);-ms-transform:rotate(18deg);transform:rotate(18deg)}16%{-webkit-transform:rotate(-12deg);-ms-transform:rotate(-12deg);transform:rotate(-12deg)}18%{-webkit-transform:rotate(12deg);-ms-transform:rotate(12deg);transform:rotate(12deg)}100%,20%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}}
  .faa-parent.animated-hover:hover>.faa-ring,.faa-ring.animated,.faa-ring.animated-hover:hover
    {-webkit-animation:ring 2s ease infinite;animation:ring 2s ease infinite;transform-origin-x:50%;transform-origin-y:0;transform-origin-z:initial}
  .faa-parent.animated-hover:hover>.faa-ring.faa-fast,.faa-ring.animated-hover.faa-fast:hover,.faa-ring.animated.faa-fast
    {-webkit-animation:ring 1s ease infinite;animation:ring 1s ease infinite}
  .faa-parent.animated-hover:hover>.faa-ring.faa-slow,.faa-ring.animated-hover.faa-slow:hover,.faa-ring.animated.faa-slow
    {-webkit-animation:ring 3s ease infinite;animation:ring 3s ease infinite}
  .faa-parent.animated-hover:hover>.faa-ring.faa-custom,.faa-ring.animated-hover.faa-custom:hover,.faa-ring.animated.faa-custom
    {-webkit-animation:ring 5s ease 2s 2;animation:ring 5s ease 2s 2}
    
  @-webkit-keyframes bounce-down{0%,10%,100%,20%,50%,80%{-webkit-transform:translateY(0);transform:translateY(0)}40%,60%{-webkit-transform:translateY(15%);transform:translateY(15%)}}
  @keyframes bounce-down{0%,10%,100%,20%,50%,80%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}40%,60%{-webkit-transform:translateY(15%);-ms-transform:translateY(15%);transform:translateY(15%)}}
  .faa-bounce-down.animated,.faa-bounce-down.animated-hover:hover,.faa-parent.animated-hover:hover>.faa-bounce-down
    {-webkit-animation:bounce-down 2s ease infinite;animation:bounce-down 2s ease infinite}
  .faa-bounce-down.animated-hover.faa-fast:hover,.faa-bounce-down.animated.faa-fast,.faa-parent.animated-hover:hover>.faa-bounce-down.faa-fast
    {-webkit-animation:bounce-down 1s ease infinite;animation:bounce-down 1s ease infinite}
  .faa-bounce-down.animated-hover.faa-slow:hover,.faa-bounce-down.animated.faa-slow,.faa-parent.animated-hover:hover>.faa-bounce-down.faa-slow
    {-webkit-animation:bounce-down 3s ease infinite;animation:bounce-down 3s ease infinite}
    
  @-webkit-keyframes bounce-up{0%,10%,100%,20%,50%,80%{-webkit-transform:translateY(0);transform:translateY(0)}40%,60%{-webkit-transform:translateY(-15%);transform:translateY(-15%)}}
  @keyframes bounce-up{0%,10%,100%,20%,50%,80%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}40%,60%{-webkit-transform:translateY(-15%);-ms-transform:translateY(-15%);transform:translateY(-15%)}}
  .faa-bounce-up.animated,.faa-bounce-up.animated-hover:hover,.faa-parent.animated-hover:hover>.faa-bounce-up
    {-webkit-animation:bounce-up 2s ease infinite;animation:bounce-up 2s ease infinite}
  .faa-bounce-up.animated-hover.faa-fast:hover,.faa-bounce-up.animated.faa-fast,.faa-parent.animated-hover:hover>.faa-bounce-up.faa-fast
    {-webkit-animation:bounce-up 1s ease infinite;animation:bounce-up 1s ease infinite}
  .faa-bounce-up.animated-hover.faa-slow:hover,.faa-bounce-up.animated.faa-slow,.faa-parent.animated-hover:hover>.faa-bounce-up.faa-slow
    {-webkit-animation:bounce-up 3s ease infinite;animation:bounce-up 3s ease infinite}
    
  @-webkit-keyframes pulse{0%{-webkit-transform:scale(1.1);transform:scale(1.1)}50%{-webkit-transform:scale(0.8);transform:scale(0.8)}100%{-webkit-transform:scale(1.1);transform:scale(1.1)}}
  @keyframes pulse{0%{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}50%{-webkit-transform:scale(0.8);-ms-transform:scale(0.8);transform:scale(0.8)}100%{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}}
  .faa-parent.animated-hover:hover>.faa-pulse,.faa-pulse.animated,.faa-pulse.animated-hover:hover
    {-webkit-animation:pulse 2s linear infinite;animation:pulse 2s linear infinite}
  .faa-parent.animated-hover:hover>.faa-pulse.faa-fast,.faa-pulse.animated-hover.faa-fast:hover,.faa-pulse.animated.faa-fast
    {-webkit-animation:pulse 1s linear infinite;animation:pulse 1s linear infinite}
  .faa-parent.animated-hover:hover>.faa-pulse.faa-slow,.faa-pulse.animated-hover.faa-slow:hover,.faa-pulse.animated.faa-slow
    {-webkit-animation:pulse 3s linear infinite;animation:pulse 3s linear infinite}
  
  @-webkit-keyframes tada{0%{-webkit-transform:perspective(1px) scale(1) translate3d(0,0,0);transform:perspective(1px) scale(1) translate3d(0,0,0)}10%,20%{-webkit-transform:perspective(1px) scale(.9) rotate(-8deg) translate3d(0,0,0);transform:perspective(1px) scale(.9) rotate(-8deg) translate3d(0,0,0)}30%,50%,70%{-webkit-transform:perspective(1px) scale(1.6) rotate(8deg) translate3d(0,0,0);transform:perspective(1px) scale(1.6) rotate(8deg) translate3d(0,0,0)}40%,60%{-webkit-transform:perspective(1px) scale(1.6) rotate(-8deg) translate3d(0,0,0);transform:perspective(1px) scale(1.6) rotate(-8deg) translate3d(0,0,0)}100%,80%{-webkit-transform:perspective(1px) scale(1) rotate(0) translate3d(0,0,0);transform:perspective(1px) scale(1) rotate(0) translate3d(0,0,0)}}
  @keyframes tada{0%{-webkit-transform:perspective(1px) scale(1);-ms-transform:scale(1) translate3d(0,0,0);transform:perspective(1px) scale(1) translate3d(0,0,0)}10%,20%{-webkit-transform:perspective(1px) scale(.9) rotate(-8deg) translate3d(0,0,0);-ms-transform:scale(.9) rotate(-8deg) translate3d(0,0,0);transform:perspective(1px) scale(.9) rotate(-8deg) translate3d(0,0,0)}30%,50%,70%{-webkit-transform:perspective(1px) scale(1.6) rotate(8deg) translate3d(0,0,0);-ms-transform:scale(1.6) rotate(8deg) translate3d(0,0,0);transform:perspective(1px) scale(1.6) rotate(8deg) translate3d(0,0,0)}40%,60%{-webkit-transform:perspective(1px) scale(1.6) rotate(-8deg) translate3d(0,0,0);-ms-transform:scale(1.3) rotate(-8deg) translate3d(0,0,0);transform:perspective(1px) scale(1.6) rotate(-8deg) translate3d(0,0,0)}100%,80%{-webkit-transform:perspective(1px) scale(1) rotate(0) translate3d(0,0,0);-ms-transform:scale(1) rotate(0) translate3d(0,0,0);transform:perspective(1px) scale(1) rotate(0) translate3d(0,0,0)}}
  .faa-parent.animated-hover:hover>.faa-tada,.faa-tada.animated,.faa-tada.animated-hover:hover{-webkit-animation:tada 2s linear infinite;animation:tada 2s linear infinite}
  .faa-parent.animated-hover:hover>.faa-tada.faa-fast,.faa-tada.animated-hover.faa-fast:hover,.faa-tada.animated.faa-fast{-webkit-animation:tada 1s linear infinite;animation:tada 1s linear infinite}
  .faa-parent.animated-hover:hover>.faa-tada.faa-slow,.faa-tada.animated-hover.faa-slow:hover,.faa-tada.animated.faa-slow{-webkit-animation:tada 3s linear infinite;animation:tada 3s linear infinite}
  .faa-parent.animated-hover:hover>.faa-tada.faa-fast-once,.faa-tada.animated-hover.faa-fast-once:hover,.faa-tada.animated.faa-fast-once{-webkit-animation:tada 1s linear 1;animation:tada 1s linear 1}
    
  /* https://css-tricks.com/centering-in-the-unknown/ */
  /* This parent can be any width and height */
  .centering_block {
      text-align: center;
    
      /* May want to do this if there is risk the container may be narrower than the element inside */
      white-space: nowrap;
  }
     
  /* The ghost, nudged to maintain perfect centering */
  .centering_block:before {
      content: '';
      display: inline-block;
      height: 100%;
      vertical-align: middle;
      margin-right: -0.25em; /* Adjusts for spacing JANKY */
  }
    
  /* The element to be centered, can also be of any width and height */ 
  .centered_content {
      display: inline-block;
      vertical-align: middle;
      width: 300px;
  }