@font-face {
  font-family: Roboto;
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/roboto/Roboto-Regular.ttf);
}
@font-face {
  font-family: RobotoBold;
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/roboto/Roboto-Medium.ttf);
}
body {
  margin: 0;
  background: #f1f1f1;
}
.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

.container-fluid, .container-sm, .container-md, .container-lg, .container-xl {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container, .container-sm {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container, .container-sm, .container-md {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container, .container-sm, .container-md, .container-lg {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container, .container-sm, .container-md, .container-lg, .container-xl {
    max-width: 1140px;
  }
}



.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}


.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col,
.col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm,
.col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md,
.col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg,
.col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl,
.col-xl-auto {
  position: relative;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
}

.col {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
}

.row-cols-1 > * {
  flex: 0 0 100%;
  max-width: 100%;
}

.row-cols-2 > * {
  flex: 0 0 50%;
  max-width: 50%;
}

.row-cols-3 > * {
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.row-cols-4 > * {
  flex: 0 0 25%;
  max-width: 25%;
}

.row-cols-5 > * {
  flex: 0 0 20%;
  max-width: 20%;
}

.row-cols-6 > * {
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}

.col-1 {
  flex: 0 0 8.333333%;
  max-width: 8.333333%;
}

.col-2 {
  flex: 0 0 16.666667%;
  max-width: 16.666667%;
}

.col-3 {
  flex: 0 0 25%;
  max-width: 25%;
}

.col-4 {
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.col-5 {
  flex: 0 0 41.666667%;
  max-width: 41.666667%;
}

.col-6 {
  flex: 0 0 50%;
  max-width: 50%;
}

.col-7 {
  flex: 0 0 58.333333%;
  max-width: 58.333333%;
}

.col-8 {
  flex: 0 0 66.666667%;
  max-width: 66.666667%;
}

.col-9 {
  flex: 0 0 75%;
  max-width: 75%;
}

.col-10 {
  flex: 0 0 83.333333%;
  max-width: 83.333333%;
}

.col-11 {
  flex: 0 0 91.666667%;
  max-width: 91.666667%;
}

.col-12 {
  flex: 0 0 100%;
  max-width: 100%;
}

.offset-1 {
  margin-left: 8.333333%;
}

.offset-2 {
  margin-left: 16.666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.333333%;
}

.offset-5 {
  margin-left: 41.666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.333333%;
}

.offset-8 {
  margin-left: 66.666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.333333%;
}

.offset-11 {
  margin-left: 91.666667%;
}

@media (min-width: 576px) {
  .col-sm {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  .row-cols-sm-1 > * {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .row-cols-sm-2 > * {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .row-cols-sm-3 > * {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .row-cols-sm-4 > * {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .row-cols-sm-5 > * {
    flex: 0 0 20%;
    max-width: 20%;
  }
  .row-cols-sm-6 > * {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-sm-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-sm-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-sm-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-sm-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-sm-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-sm-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-sm-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-sm-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-sm-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-sm-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-sm-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-sm-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-sm-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .offset-sm-0 {
    margin-left: 0;
  }
  .offset-sm-1 {
    margin-left: 8.333333%;
  }
  .offset-sm-2 {
    margin-left: 16.666667%;
  }
  .offset-sm-3 {
    margin-left: 25%;
  }
  .offset-sm-4 {
    margin-left: 33.333333%;
  }
  .offset-sm-5 {
    margin-left: 41.666667%;
  }
  .offset-sm-6 {
    margin-left: 50%;
  }
  .offset-sm-7 {
    margin-left: 58.333333%;
  }
  .offset-sm-8 {
    margin-left: 66.666667%;
  }
  .offset-sm-9 {
    margin-left: 75%;
  }
  .offset-sm-10 {
    margin-left: 83.333333%;
  }
  .offset-sm-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 768px) {
  .col-md {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  .row-cols-md-1 > * {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .row-cols-md-2 > * {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .row-cols-md-3 > * {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .row-cols-md-4 > * {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .row-cols-md-5 > * {
    flex: 0 0 20%;
    max-width: 20%;
  }
  .row-cols-md-6 > * {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-md-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-md-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-md-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-md-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-md-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-md-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-md-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-md-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-md-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-md-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-md-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .offset-md-0 {
    margin-left: 0;
  }
  .offset-md-1 {
    margin-left: 8.333333%;
  }
  .offset-md-2 {
    margin-left: 16.666667%;
  }
  .offset-md-3 {
    margin-left: 25%;
  }
  .offset-md-4 {
    margin-left: 33.333333%;
  }
  .offset-md-5 {
    margin-left: 41.666667%;
  }
  .offset-md-6 {
    margin-left: 50%;
  }
  .offset-md-7 {
    margin-left: 58.333333%;
  }
  .offset-md-8 {
    margin-left: 66.666667%;
  }
  .offset-md-9 {
    margin-left: 75%;
  }
  .offset-md-10 {
    margin-left: 83.333333%;
  }
  .offset-md-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 992px) {
  .col-lg {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  .row-cols-lg-1 > * {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .row-cols-lg-2 > * {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .row-cols-lg-3 > * {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .row-cols-lg-4 > * {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .row-cols-lg-5 > * {
    flex: 0 0 20%;
    max-width: 20%;
  }
  .row-cols-lg-6 > * {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-lg-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-lg-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-lg-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-lg-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-lg-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-lg-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-lg-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-lg-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-lg-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-lg-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-lg-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-lg-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-lg-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .offset-lg-0 {
    margin-left: 0;
  }
  .offset-lg-1 {
    margin-left: 8.333333%;
  }
  .offset-lg-2 {
    margin-left: 16.666667%;
  }
  .offset-lg-3 {
    margin-left: 25%;
  }
  .offset-lg-4 {
    margin-left: 33.333333%;
  }
  .offset-lg-5 {
    margin-left: 41.666667%;
  }
  .offset-lg-6 {
    margin-left: 50%;
  }
  .offset-lg-7 {
    margin-left: 58.333333%;
  }
  .offset-lg-8 {
    margin-left: 66.666667%;
  }
  .offset-lg-9 {
    margin-left: 75%;
  }
  .offset-lg-10 {
    margin-left: 83.333333%;
  }
  .offset-lg-11 {
    margin-left: 91.666667%;
  }
}

@media (min-width: 1200px) {
  .col-xl {
    flex-basis: 0;
    flex-grow: 1;
    max-width: 100%;
  }
  .row-cols-xl-1 > * {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .row-cols-xl-2 > * {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .row-cols-xl-3 > * {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .row-cols-xl-4 > * {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .row-cols-xl-5 > * {
    flex: 0 0 20%;
    max-width: 20%;
  }
  .row-cols-xl-6 > * {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-xl-auto {
    flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .col-xl-1 {
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .col-xl-2 {
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .col-xl-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  .col-xl-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .col-xl-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }
  .col-xl-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  .col-xl-7 {
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
  .col-xl-8 {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
  .col-xl-9 {
    flex: 0 0 75%;
    max-width: 75%;
  }
  .col-xl-10 {
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
  .col-xl-11 {
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
  .col-xl-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  .offset-xl-0 {
    margin-left: 0;
  }
  .offset-xl-1 {
    margin-left: 8.333333%;
  }
  .offset-xl-2 {
    margin-left: 16.666667%;
  }
  .offset-xl-3 {
    margin-left: 25%;
  }
  .offset-xl-4 {
    margin-left: 33.333333%;
  }
  .offset-xl-5 {
    margin-left: 41.666667%;
  }
  .offset-xl-6 {
    margin-left: 50%;
  }
  .offset-xl-7 {
    margin-left: 58.333333%;
  }
  .offset-xl-8 {
    margin-left: 66.666667%;
  }
  .offset-xl-9 {
    margin-left: 75%;
  }
  .offset-xl-10 {
    margin-left: 83.333333%;
  }
  .offset-xl-11 {
    margin-left: 91.666667%;
  }
}
.tab-content > .tab-pane {
  display: none;
}

.tab-content > .active {
  display: block;
}
table {
  border-collapse: collapse;
}
.table {
  width: 100%;
  margin-bottom: 1rem;
  color: #212529;
}

.table th,
.table td {
  padding: 0.75rem;
  vertical-align: top;
  border-top: 1px solid #dee2e6;
}

.table thead th {
  vertical-align: bottom;
  border-bottom: 2px solid #dee2e6;
}

.table tbody + tbody {
  border-top: 2px solid #dee2e6;
}

.table-sm th,
.table-sm td {
  padding: 0.3rem;
}

.table-bordered {
  border: 1px solid #dee2e6;
}

.table-bordered th,
.table-bordered td {
  border: 1px solid #dee2e6;
}

.table-bordered thead th,
.table-bordered thead td {
  border-bottom-width: 2px;
}

.table-borderless th,
.table-borderless td,
.table-borderless thead th,
.table-borderless tbody + tbody {
  border: 0;
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(0, 0, 0, 0.05);
}

.table-hover tbody tr:hover {
  color: #212529;
  background-color: rgba(0, 0, 0, 0.075);
}

.table-primary,
.table-primary > th,
.table-primary > td {
  background-color: #b8daff;
}

.table-primary th,
.table-primary td,
.table-primary thead th,
.table-primary tbody + tbody {
  border-color: #7abaff;
}

.table-hover .table-primary:hover {
  background-color: #9fcdff;
}

.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
  background-color: #9fcdff;
}

.table-secondary,
.table-secondary > th,
.table-secondary > td {
  background-color: #d6d8db;
}

.table-secondary th,
.table-secondary td,
.table-secondary thead th,
.table-secondary tbody + tbody {
  border-color: #b3b7bb;
}

.table-hover .table-secondary:hover {
  background-color: #c8cbcf;
}

.table-hover .table-secondary:hover > td,
.table-hover .table-secondary:hover > th {
  background-color: #c8cbcf;
}

.table-success,
.table-success > th,
.table-success > td {
  background-color: #c3e6cb;
}

.table-success th,
.table-success td,
.table-success thead th,
.table-success tbody + tbody {
  border-color: #8fd19e;
}

.table-hover .table-success:hover {
  background-color: #b1dfbb;
}

.table-hover .table-success:hover > td,
.table-hover .table-success:hover > th {
  background-color: #b1dfbb;
}

.table-info,
.table-info > th,
.table-info > td {
  background-color: #bee5eb;
}

.table-info th,
.table-info td,
.table-info thead th,
.table-info tbody + tbody {
  border-color: #86cfda;
}

.table-hover .table-info:hover {
  background-color: #abdde5;
}

.table-hover .table-info:hover > td,
.table-hover .table-info:hover > th {
  background-color: #abdde5;
}

.table-warning,
.table-warning > th,
.table-warning > td {
  background-color: #ffeeba;
}

.table-warning th,
.table-warning td,
.table-warning thead th,
.table-warning tbody + tbody {
  border-color: #ffdf7e;
}

.table-hover .table-warning:hover {
  background-color: #ffe8a1;
}

.table-hover .table-warning:hover > td,
.table-hover .table-warning:hover > th {
  background-color: #ffe8a1;
}

.table-danger,
.table-danger > th,
.table-danger > td {
  background-color: #f5c6cb;
}

.table-danger th,
.table-danger td,
.table-danger thead th,
.table-danger tbody + tbody {
  border-color: #ed969e;
}

.table-hover .table-danger:hover {
  background-color: #f1b0b7;
}

.table-hover .table-danger:hover > td,
.table-hover .table-danger:hover > th {
  background-color: #f1b0b7;
}

.table-light,
.table-light > th,
.table-light > td {
  background-color: #fdfdfe;
}

.table-light th,
.table-light td,
.table-light thead th,
.table-light tbody + tbody {
  border-color: #fbfcfc;
}

.table-hover .table-light:hover {
  background-color: #ececf6;
}

.table-hover .table-light:hover > td,
.table-hover .table-light:hover > th {
  background-color: #ececf6;
}

.table-dark,
.table-dark > th,
.table-dark > td {
  background-color: #c6c8ca;
}

.table-dark th,
.table-dark td,
.table-dark thead th,
.table-dark tbody + tbody {
  border-color: #95999c;
}

.table-hover .table-dark:hover {
  background-color: #b9bbbe;
}

.table-hover .table-dark:hover > td,
.table-hover .table-dark:hover > th {
  background-color: #b9bbbe;
}

.table-active,
.table-active > th,
.table-active > td {
  background-color: rgba(0, 0, 0, 0.075);
}

.table-hover .table-active:hover {
  background-color: rgba(0, 0, 0, 0.075);
}

.table-hover .table-active:hover > td,
.table-hover .table-active:hover > th {
  background-color: rgba(0, 0, 0, 0.075);
}

.table .thead-dark th {
  color: #fff;
  background-color: #343a40;
  border-color: #454d55;
}

.table .thead-light th {
  color: #495057;
  background-color: #e9ecef;
  border-color: #dee2e6;
}

.table-dark {
  color: #fff;
  background-color: #343a40;
}

.table-dark th,
.table-dark td,
.table-dark thead th {
  border-color: #454d55;
}

.table-dark.table-bordered {
  border: 0;
}

.table-dark.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.05);
}

.table-dark.table-hover tbody tr:hover {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.075);
}

@media (max-width: 575.98px) {
  .table-responsive-sm {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive-sm > .table-bordered {
    border: 0;
  }
}

@media (max-width: 767.98px) {
  .table-responsive-md {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive-md > .table-bordered {
    border: 0;
  }
}

@media (max-width: 991.98px) {
  .table-responsive-lg {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive-lg > .table-bordered {
    border: 0;
  }
}

@media (max-width: 1199.98px) {
  .table-responsive-xl {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive-xl > .table-bordered {
    border: 0;
  }
}

.table-responsive {
  display: block;
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-responsive > .table-bordered {
  border: 0;
}







.abs-header {
  z-index: 1;
  width: 100%;
  height: 64px;
  overflow: hidden;
  background: #fff;
  position: relative;
  -webkit-box-shadow: rgba(0, 0, 0, 0.12) 0px 2px 6px 0px, rgb(218, 220, 224) 0px -1px 0px 0px inset;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 2px 6px 0px, rgb(218, 220, 224) 0px -1px 0px 0px inset;
}
.abs-header > .abs-header-logo {
  width: 340px;
  text-decoration: none;
  padding: 0;
  font-size: 16px;
  line-height: 1;
  height: 18px;
  left: 30px;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  color: #030303;
  margin: auto 0;
  font-weight: 400;
  font-family: Roboto;
}



.abs-header > .abs-header-button {
  top: 0;
  bottom: 0;
  margin: auto 0;
  text-align: center;
  padding: 0;
    color: #fff;
    display: inline-block;
    font-size: 16px;
    letter-spacing: .5px;
    text-decoration: none;
	border-radius: 2px;
	height: 46px;
	width: 194px;
    right: 10px;
	line-height: 46px;
    position: absolute;
    background: #1a73e8;
  font-weight: 500;
font-family: RobotoBold;
}
.abs-header > .abs-header-button:hover {
background: #cc0000;
}

.abs-body {
margin: 0;
padding: 0;
overflow: hidden;
}
.abs-body .row{
margin: 0;
padding: 0;
}
.abs-body .abs-body-side-bar{
margin: 0;
padding: 0;
}
.abs-body .abs-body-side-bar > ul{
top:0;
padding: 0;
font-size: 0;
background: #fff;
list-style-type: none;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
    position: fixed;
    max-width: inherit;
    width: inherit;
}
.abs-body .abs-body-side-bar > ul::-webkit-scrollbar {
  width: 8px;
  height: 8px;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
  border-radius: 0;
  -webkit-border-radius: 0;
}
.abs-body .abs-body-side-bar > ul::-webkit-scrollbar-track {
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
  border-radius: 0;
  -webkit-border-radius: 0;
}
.abs-body .abs-body-side-bar > ul::-webkit-scrollbar-thumb {
  margin: 0;
  padding: 0;
  width: 8px;
  height: 30px;
  border: none;
  background: #cfcfcf;
  box-shadow: none;
  -webkit-box-shadow: none;
  border-radius: 0;
  -webkit-border-radius: 0;
}
.abs-body .abs-body-side-bar > ul::-webkit-scrollbar-track-piece {
  margin: 0;
  padding: 0;
  width: 30px;
  height: 30px;
  border: none;
  background: transparent;
  box-shadow: none;
  -webkit-box-shadow: none;
  border-radius: 0;
  -webkit-border-radius: 0;
}
.abs-body .abs-body-side-bar > ul > li {
  margin: 0;
  padding: 0;
  font-size: 0;
  display: block;
}
.abs-body .abs-body-side-bar > ul a{
  padding: 15px;
  margin: 0 0;
  text-align: left;
  color: #030303;
  display: block;
  font-size: 14px;
  font-weight: 500;
  width: 100%;
  background: #fff;
  font-family: RobotoBold;
  text-transform: capitalize;
  text-decoration: none;

}
.abs-body .abs-body-side-bar > ul a:hover {
  background: #f2f2f2;
}
.abs-body .abs-body-side-bar > ul a.active {
  background: #e5e5e5;
}
.abs-body .abs-body-side-bar > ul a.active:hover {
  background: #d9d9d9;
}
.abs-side-bar-logo{
  width: 100%;
  display: block;
  background: #fff;
}
.abs-side-bar-logo img{
  width: 185px;
  margin: 0 auto 10px auto;
  display: block;
}
.abs-body .abs-body-side-bar > ul a.abs-side-bar-logo{
  margin: 0;
  padding: 20px 0;
  background: #fff;
  text-align: center;
}
@media (max-width: 575px) {
  .abs-side-bar-logo img{
    width: 200px;
  }
  .abs-body .abs-body-side-bar > ul li {
    width: 170px;
    margin: 0 2px 25px 2px;
    display: inline-block;
  }
  .abs-body .abs-body-side-bar > ul li.abs-side-bar-logo-li {
    margin: 0;
    width: 100%;
    display: block;
  }
  .abs-body .abs-body-side-bar > ul li,
  .abs-body .abs-body-side-bar > ul li a,
  .abs-body .abs-body-side-bar > ul {
    position: relative;
	text-align: center;
  }
  .abs-body .abs-body-side-bar > ul li a {
    padding: 20px 0;
    margin: 0;
  }
  .abs-body .abs-body-side-bar > ul a.abs-side-bar-logo {
    padding: 20px 8px;
    margin: 0 0 25px 0;
  }
}
.abs-body .abs-body-demo{
margin: 0;
padding: 0;

}
.abs-body-demo-container {
  padding: 0;
}
.abs-body .abs-body-demo .container-fluid,
.abs-body .abs-body-demo .container-fluid > .row,
.abs-body .abs-body-demo .container-fluid > .row > div {
  margin: 0;
  padding: 0;
}
.tab-headers {
  padding: 40px;
  background: #f9f9f9;
}
.tab-headers h1 {
  margin: 0;
  font-size: 26px;
  color: #606060;
  font-weight: 500;
  font-family: RobotoBold;
  text-transform: capitalize;
}
.tab-headers h6 {
  margin: 0;
  font-size: 16px;
  color: #000;
  padding: 25px;
  margin: 25px 0;
  background: #fde9e5;
  border-left: 4px solid #ee350f;
  font-weight: 400;
  font-family: Roboto;
}
.tab-headers h6 span {
  color: #6332f6;
}
.tab-headers p {
  color: #030303;
  margin: 20px 0;
  font-size: 16px;
  font-weight: 400;
  font-family: Roboto;
}
.tab-headers p span {
  color: #6332f6;
}
.tab-bodys {
  padding: 40px;
}
.tab-bodys img {
  width: 100%;
  display:block;
}
.tab-uls {
  margin: 0;
  padding: 0;
  font-size: 0;
  list-style-type: none;
}
.tab-uls li {
  margin: 10px 0;
  padding: 0;
  display: block;
  font-size: 16px;
  font-weight: 400;
  font-family: Roboto;
}
.tab-uls li span {
  color: #6332f6;
}
.tab-bodys pre {
  color: #fff;
  padding: 0 20px;
  font-size: 16px;
  font-weight: 400;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  display: block;
  font-family: Roboto;
  background: #253238;
  overflow: auto;
  
}
.tab-bodys h3 {
  margin: 0;
  font-size: 16px;
  color: #000;
  padding: 15px;
  margin: 75px 0 0 0;
  background: #fff;
  border-left: 4px solid #1a73e8;
  font-weight: 400;
  font-family: Roboto;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 10px 20px -8px rgba(0,0,0,0.24);
  box-shadow: 0 10px 20px -8px rgba(0,0,0,0.24);
}
.tab-bodys h3 span {
  color: #1a73e8;
}
.tag-DOCTYPE {
  color: #aaa;
}
.tags {
  color: #f27076;
}
.attr-nam {
  color: #ffcc63;
}
.attr-val {
  color: #c2e988;
}
.coments {
  color: #6c8e9e;
}


.abs-tabs-nav-child {
  top:0;
  padding: 0;
  font-size: 0;
  position: relative;
  text-align: center;
  list-style-type: none;
  background: transparent;
}
.abs-tabs-nav-child li {
  margin: 3px;
  width: 120px;
  height: 32px;
  display: block;
  font-size: 16px;
  overflow: hidden;
  font-weight: 400;
  line-height: 32px;
  font-family: Roboto;
  display: inline-block;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -webkit-box-shadow: 0 10px 20px -8px rgba(0,0,0,0.24);
  box-shadow: 0 10px 20px -8px rgba(0,0,0,0.24);
}
.abs-tabs-nav-child li a {
  color: #fff;
  width: 100%;
  height: 100%;
  display: block;
  background: #7a7b7c;
  text-decoration: none;
}
.abs-tabs-nav-child li a.active {
  background: #1a73e8;
}
.abs-tab-content-child {
  padding: 40px;
  margin: 15px 0;
  background: #b6babc;
  border-radius: 4px;
  -webkit-border-radius: 4px;
}
.abs-table table {
 background: #fff;
 text-align: center;
}
.abs-table td {
  color: #000;
  font-size: 16px;
  font-weight: 400;
  font-family: Roboto;
  border: 1px solid #6c8e9e;
}
.anim-efct-part {
  width: 100%;
  height: 250px;
  font-weight: 400;
  position: relative;
  font-family: Roboto;
  background: #f1f1f1;
}
.anim-efct-part > span {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  color: #fff;
  margin: auto;
  width: 100px;
  height: 100px;
  display: block;
  font-size: 22px;
  position: absolute;
  line-height: 100px;
  text-align: center;
  background: #253238;
  border-radius: 5px;
  -webkit-border-radius: 5px;
}
.anim-list {
  margin: 0;
  padding: 0;
  font-size: 0;
  display: block;
  font-weight: 400;
  list-style: none;
  min-width: 1100px;
  text-align: center;
  font-family: Roboto;
}
.anim-list > li {
  color: #fff;
  width: 108px;
  height: 40px;
  font-size: 12px;
  overflow: hidden;
  text-align: center;
  line-height: 20px;
  display: inline-block;
  background: transparent;
  margin: auto 6px 6px auto;
  border-radius: 4px;
  -webkit-border-radius: 4px;
}
.anim-list > li > .anim-cls-nm {
  color: #000;
  display: block;
  background: #fff;
}
.anim-list > li .anim-ply-btn {
  color: #fff;
  width: 100%;
  display: block;
  font-size: 12px;
  cursor: pointer;
  font-weight: 500;
  position: relative;
  background: #1a73e8;
  text-transform: uppercase;
}
.anim-list > li > .anim-ply-btn > span {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  color: #000;
  width: 16px;
  height: 16px;
  font-size: 9px;
  line-height: 16px;
  position: absolute;
  background: #f1f1f1;
  text-transform: capitalize;
  margin: auto auto auto 2px;
  border-radius: 100%;
  -webkit-border-radius: 100%;
}
.animton-tab-pane {
  overflow-x: scroll;
}

















/*!
 * All
 * Animation
 * Effects
 */

.sz-animated {
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000);
  animation-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000);
}

/*!
 * Magic - https://www.minimamente.com
 * Licensed under the MIT license - https://opensource.org/licenses/MIT
 * Copyright (c) 2019 Christian Pucci
 */

/* boingInUp */
.boInUp {
  -webkit-animation-name: boInUp;
  animation-name: boInUp;
}
@-webkit-keyframes boInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(-90deg);
    transform: perspective(800px) rotateX(-90deg);
  }
  50% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(50deg);
    transform: perspective(800px) rotateX(50deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
}
@keyframes boInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(-90deg);
    transform: perspective(800px) rotateX(-90deg);
  }
  50% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(50deg);
    transform: perspective(800px) rotateX(50deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
}

/* boingOutDown */
.boOutDwn {
  -webkit-animation-name: boOutDwn;
  animation-name: boOutDwn;
}
@-webkit-keyframes boOutDwn {
  0% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
    transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(10deg);
    transform: perspective(800px) rotateX(0deg) rotateY(10deg);
  }
  30% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
    transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: perspective(800px) rotateX(10deg) rotateY(10deg);
    transform: perspective(800px) rotateX(10deg) rotateY(10deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(90deg) rotateY(0deg);
    transform: perspective(800px) rotateX(90deg) rotateY(0deg);
  }
}
@keyframes boOutDwn {
  0% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
    transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(10deg);
    transform: perspective(800px) rotateX(0deg) rotateY(10deg);
  }
  30% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: perspective(800px) rotateX(0deg) rotateY(0deg);
    transform: perspective(800px) rotateX(0deg) rotateY(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: perspective(800px) rotateX(10deg) rotateY(10deg);
    transform: perspective(800px) rotateX(10deg) rotateY(10deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: perspective(800px) rotateX(90deg) rotateY(0deg);
    transform: perspective(800px) rotateX(90deg) rotateY(0deg);
  }
}

/* twisterInDown */
.twstInDwn {
  -webkit-animation-name: twstInDwn;
  animation-name: twstInDwn;
}
@-webkit-keyframes twstInDwn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
    transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  30% {
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
    transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0%);
    transform: scale(1, 1) rotate(0deg) translateY(0%);
  }
}
@keyframes twstInDwn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
    transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  30% {
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(-100%);
    transform: scale(0, 0) rotate(360deg) translateY(-100%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0%);
    transform: scale(1, 1) rotate(0deg) translateY(0%);
  }
}

/* twisterInUp */
.twstInUp {
  -webkit-animation-name: twstInUp;
  animation-name: twstInUp;
}
@-webkit-keyframes twstInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
    transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  30% {
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
    transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0);
    transform: scale(1, 1) rotate(0deg) translateY(0);
  }
}
@keyframes twstInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
    transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  30% {
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: scale(0, 0) rotate(360deg) translateY(100%);
    transform: scale(0, 0) rotate(360deg) translateY(100%);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: scale(1, 1) rotate(0deg) translateY(0);
    transform: scale(1, 1) rotate(0deg) translateY(0);
  }
}

/* foolishIn */
.folshIn {
  -webkit-animation-name: folshIn;
  animation-name: folshIn;
}
@-webkit-keyframes folshIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotate(360deg);
    transform: scale(0, 0) rotate(360deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    -webkit-transform-origin: 0%;
    transform-origin: 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotate(0deg);
    transform: scale(1, 1) rotate(0deg);
  }
}
@keyframes folshIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotate(360deg);
    transform: scale(0, 0) rotate(360deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    -webkit-transform-origin: 0%;
    transform-origin: 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotate(0deg);
    transform: scale(1, 1) rotate(0deg);
  }
}

/* foolishOut */
.folshOut {
  -webkit-animation-name: folshOut;
  animation-name: folshOut;
}
@-webkit-keyframes folshOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotate(360deg);
    transform: scale(1, 1) rotate(360deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    -webkit-transform-origin: 0%;
    transform-origin: 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotate(0deg);
    transform: scale(0, 0) rotate(0deg);
  }
}
@keyframes folshOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotate(360deg);
    transform: scale(1, 1) rotate(360deg);
  }
  20% {
    opacity: 1;
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  40% {
    opacity: 1;
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  60% {
    opacity: 1;
    -webkit-transform-origin: 0%;
    transform-origin: 0%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  80% {
    opacity: 1;
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-transform: scale(0.5, 0.5) rotate(0deg);
    transform: scale(0.5, 0.5) rotate(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotate(0deg);
    transform: scale(0, 0) rotate(0deg);
  }
}

/* holeOut */
.holeOut {
  -webkit-animation-name: holeOut;
  animation-name: holeOut;
}
@-webkit-keyframes holeOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotateY(0deg);
    transform: scale(1, 1) rotateY(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotateY(180deg);
    transform: scale(0, 0) rotateY(180deg);
  }
}
@keyframes holeOut {
  0% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1) rotateY(0deg);
    transform: scale(1, 1) rotateY(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transform: scale(0, 0) rotateY(180deg);
    transform: scale(0, 0) rotateY(180deg);
  }
}

/* perspectiveDown */
.prspDwn {
  -webkit-animation-name: prspDwn;
  animation-name: prspDwn;
}
@-webkit-keyframes prspDwn {
  0% {
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg);
    transform: perspective(800px) rotateX(-180deg);
  }
}
@keyframes prspDwn {
  0% {
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg); }
  100% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg);
    transform: perspective(800px) rotateX(-180deg);
  }
}

/* perspectiveDownReturn */
.prspDwnR {
  -webkit-animation-name: prspDwnR;
  animation-name: prspDwnR;
}
@-webkit-keyframes prspDwnR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg);
    transform: perspective(800px) rotateX(-180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
}
@keyframes prspDwnR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg);
    transform: perspective(800px) rotateX(-180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
}

/* perspectiveLeft */
.prspLft {
  -webkit-animation-name: prspLft;
  animation-name: prspLft;
}
@-webkit-keyframes prspLft {
  0% {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(-180deg);
    transform: perspective(800px) rotateY(-180deg);
  }
}
@keyframes prspLft {
  0% {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(-180deg);
    transform: perspective(800px) rotateY(-180deg);
  }
}

/* perspectiveLeftReturn */
.prspLftR {
  -webkit-animation-name: prspLftR;
  animation-name: prspLftR;
}
@-webkit-keyframes prspLftR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(-180deg);
    transform: perspective(800px) rotateY(-180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
}
@keyframes prspLftR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(-180deg);
    transform: perspective(800px) rotateY(-180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
}

/* perspectiveRight */
.prspRgt {
  -webkit-animation-name: prspRgt;
  animation-name: prspRgt;
}
@-webkit-keyframes prspRgt {
  0% {
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(180deg);
    transform: perspective(800px) rotateY(180deg);
  }
}
@keyframes prspRgt {
  0% {
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(180deg);
    transform: perspective(800px) rotateY(180deg);
  }
}

/* perspectiveRightReturn */
.prspRgtR {
  -webkit-animation-name: prspRgtR;
  animation-name: prspRgtR;
}
@-webkit-keyframes prspRgtR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(180deg);
    transform: perspective(800px) rotateY(180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
}
@keyframes prspRgtR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(180deg);
    transform: perspective(800px) rotateY(180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
    -webkit-transform: perspective(800px) rotateY(0deg);
    transform: perspective(800px) rotateY(0deg);
  }
}

/* perspectiveUp */
.prspUp {
  -webkit-animation-name: prspUp;
  animation-name: prspUp;
}
@-webkit-keyframes prspUp {
  0% {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(180deg);
    transform: perspective(800px) rotateX(180deg);
  }
}
@keyframes prspUp {
  0% {
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(180deg);
    transform: perspective(800px) rotateX(180deg);
  }
}

/* perspectiveUpReturn */
.prspUpR {
  -webkit-animation-name: prspUpR;
  animation-name: prspUpR;
}
@-webkit-keyframes prspUpR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(180deg);
    transform: perspective(800px) rotateX(180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
}
@keyframes prspUpR {
  0% {
    opacity: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(180deg);
    transform: perspective(800px) rotateX(180deg);
  }
  100% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg);
    transform: perspective(800px) rotateX(0deg);
  }
}

/* rotateDown */
.rotDwn {
  -webkit-animation-name: rotDwn;
  animation-name: rotDwn;
}
@-webkit-keyframes rotDwn {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
    transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg) translateZ(300px);
    transform: perspective(800px) rotateX(-180deg) translateZ(300px);
  }
}
@keyframes rotDwn {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
    transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transform: perspective(800px) rotateX(-180deg) translateZ(300px);
    transform: perspective(800px) rotateX(-180deg) translateZ(300px);
  }
}

/* rotateLeft */
.rotLf {
  -webkit-animation-name: rotLf;
  animation-name: rotLf;
}
@-webkit-keyframes rotLf {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg) translateZ(0px);
    transform: perspective(800px) rotateY(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateY(-180deg) translateZ(300px);
    transform: perspective(800px) rotateY(-180deg) translateZ(300px);
  }
}
@keyframes rotLf {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg) translateZ(0px);
    transform: perspective(800px) rotateY(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateY(-180deg) translateZ(300px);
    transform: perspective(800px) rotateY(-180deg) translateZ(300px);
  }
}

/* rotateRight */
.rotRt {
  -webkit-animation-name: rotRt;
  animation-name: rotRt;
}
@-webkit-keyframes rotRt {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0px);
    transform: perspective(800px) rotateY(0deg) translate3d(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateY(180deg) translateZ(150px);
    transform: perspective(800px) rotateY(180deg) translateZ(150px);
  }
}
@keyframes rotRt {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateY(0deg) translate3d(0px);
    transform: perspective(800px) rotateY(0deg) translate3d(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateY(180deg) translateZ(150px);
    transform: perspective(800px) rotateY(180deg) translateZ(150px);
  }
}

/* rotateUp */
.rotUp {
  -webkit-animation-name: rotUp;
  animation-name: rotUp;
}
@-webkit-keyframes rotUp {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
    transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px);
    transform: perspective(800px) rotateX(180deg) translateZ(100px);
  }
}
@keyframes rotUp {
  0% {
    opacity: 1;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: perspective(800px) rotateX(0deg) translateZ(0px);
    transform: perspective(800px) rotateX(0deg) translateZ(0px);
  }
  100% {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: perspective(800px) rotateX(180deg) translateZ(100px);
    transform: perspective(800px) rotateX(180deg) translateZ(100px);
  }
}

/* ----------------------------------------------
 * Generated by Animista on 2020-4-20 14:4:22
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/* scale-in-center */
.sclInCntr {
  -webkit-animation-name: sclInCntr;
  animation-name: sclInCntr;
}
@-webkit-keyframes sclInCntr {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes sclInCntr {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

/* scale-in-top */
.sclInTp {
  -webkit-animation-name: sclInTp;
  animation-name: sclInTp;
}
@-webkit-keyframes sclInTp {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
}
@keyframes sclInTp {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
}

/* scale-in-tr */
.sclInTr {
  -webkit-animation-name: sclInTr;
  animation-name: sclInTr;
}
@-webkit-keyframes sclInTr {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes sclInTr {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* scale-in-right */
.sclInRgt {
  -webkit-animation-name: sclInRgt;
  animation-name: sclInRgt;
}
@-webkit-keyframes sclInRgt {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}
@keyframes sclInRgt {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}

/* scale-in-br */
.sclInBr {
  -webkit-animation-name: sclInBr;
  animation-name: sclInBr;
}
@-webkit-keyframes sclInBr {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes sclInBr {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* scale-in-bottom */
.sclInBtm {
  -webkit-animation-name: sclInBtm;
  animation-name: sclInBtm;
}
@-webkit-keyframes sclInBtm {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}
@keyframes sclInBtm {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}

/* scale-in-bl */
.sclInBl {
  -webkit-animation-name: sclInBl;
  animation-name: sclInBl;
}
@-webkit-keyframes sclInBl {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}
@keyframes sclInBl {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}

/* scale-in-left */
.sclInLft {
  -webkit-animation-name: sclInLft;
  animation-name: sclInLft;
}
@-webkit-keyframes sclInLft {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
}
@keyframes sclInLft {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
}

/* scale-in-tl */
.sclInTl {
  -webkit-animation-name: sclInTl;
  animation-name: sclInTl;
}
@-webkit-keyframes sclInTl {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
}
@keyframes sclInTl {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
}

/* scale-in-x */
.sclInX {
  -webkit-animation-name: sclInX;
  animation-name: sclInX;
}
@-webkit-keyframes sclInX {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1;
  }
}
@keyframes sclInX {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1;
  }
}

/* scale-in-x-left */
.sclInXLft {
  -webkit-animation-name: sclInXLft;
  animation-name: sclInXLft;
}
@-webkit-keyframes sclInXLft {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
}
@keyframes sclInXLft {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    opacity: 1;
  }
}

/* scale-in-x-right */
.sclInXRgt {
  -webkit-animation-name: sclInXRgt;
  animation-name: sclInXRgt;
}
@-webkit-keyframes sclInXRgt {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes sclInXRgt {
  0% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* scale-in-y */
.sclInY {
  -webkit-animation-name: sclInY;
  animation-name: sclInY;
}
@-webkit-keyframes sclInY {
  0% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
  }
}
@keyframes sclInY {
  0% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
  }
}

/* scale-in-y-top */
.sclInYTp {
  -webkit-animation-name: sclInYTp;
  animation-name: sclInYTp;
}
@-webkit-keyframes sclInYTp {
  0% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes sclInYTp {
  0% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* scale-in-y-bottom */
.sclInYBtm {
  -webkit-animation-name: sclInYBtm;
  animation-name: sclInYBtm;
}
@-webkit-keyframes sclInYBtm {
  0% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}
@keyframes sclInYBtm {
  0% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}

/* rotate-in-center */
.rotInCntr {
  -webkit-animation-name: rotInCntr;
  animation-name: rotInCntr;
}
@-webkit-keyframes rotInCntr {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}
@keyframes rotInCntr {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

/* rotate-in-top */
.rotInTp {
  -webkit-animation-name: rotInTp;
  animation-name: rotInTp;
}
@-webkit-keyframes rotInTp {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1;
  }
}
@keyframes rotInTp {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1;
  }
}

/* rotate-in-tr */
.rotInTr {
  -webkit-animation-name: rotInTr;
  animation-name: rotInTr;
}
@-webkit-keyframes rotInTr {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 1;
  }
}
@keyframes rotInTr {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 1;
  }
}

/* rotate-in-right */
.rotInRgt {
  -webkit-animation-name: rotInRgt;
  animation-name: rotInRgt;
}
@-webkit-keyframes rotInRgt {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 1;
  }
}
@keyframes rotInRgt {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 1;
  }
}

/* rotate-in-br */
.rotInBr {
  -webkit-animation-name: rotInBr;
  animation-name: rotInBr;
}
@-webkit-keyframes rotInBr {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 1;
  }
}
@keyframes rotInBr {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 1;
  }
}

/* rotate-in-bottom */
.rotInBtm {
  -webkit-animation-name: rotInBtm;
  animation-name: rotInBtm;
}
@-webkit-keyframes rotInBtm {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 1;
  }
}
@keyframes rotInBtm {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 1;
  }
}

/* rotate-in-bl */
.rotInBl {
  -webkit-animation-name: rotInBl;
  animation-name: rotInBl;
}
@-webkit-keyframes rotInBl {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 1;
  }
}
@keyframes rotInBl {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 1;
  }
}

/* rotate-in-left */
.rotInLft {
  -webkit-animation-name: rotInLft;
  animation-name: rotInLft;
}
@-webkit-keyframes rotInLft {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 1;
  }
}
@keyframes rotInLft {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 1;
  }
}

/* rotate-in-tl */
.rotInTl {
  -webkit-animation-name: rotInTl;
  animation-name: rotInTl;
}
@-webkit-keyframes rotInTl {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 1;
  }
}
@keyframes rotInTl {
  0% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 1;
  }
}

/* rotate-in-x */
.rotInX {
  -webkit-animation-name: rotInX;
  animation-name: rotInX;
}
@-webkit-keyframes rotInX {
  0% {
    -webkit-transform: rotateX(360deg);
    transform: rotateX(360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
  }
}
@keyframes rotInX {
  0% {
    -webkit-transform: rotateX(360deg);
    transform: rotateX(360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
  }
}

/* rotate-in-y */
.rotInY {
  -webkit-animation-name: rotInY;
  animation-name: rotInY;
}
@-webkit-keyframes rotInY {
  0% {
    -webkit-transform: rotateY(-360deg);
    transform: rotateY(-360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    opacity: 1;
  }
}
@keyframes rotInY {
  0% {
    -webkit-transform: rotateY(-360deg);
    transform: rotateY(-360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    opacity: 1;
  }
}

/* rotate-in-diagonal-right */
.rotInRgtDgnl {
  -webkit-animation-name: rotInRgtDgnl;
  animation-name: rotInRgtDgnl;
}
@-webkit-keyframes rotInRgtDgnl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
    transform: rotate3d(1, 1, 0, -360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}
@keyframes rotInRgtDgnl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
    transform: rotate3d(1, 1, 0, -360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}

/* rotate-in-diagonal-left */
.rotInLftDgnl {
  -webkit-animation-name: rotInLftDgnl;
  animation-name: rotInLftDgnl;
}
@-webkit-keyframes rotInLftDgnl {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, -360deg);
    transform: rotate3d(-1, 1, 0, -360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    opacity: 1;
  }
}
@keyframes rotInLftDgnl {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, -360deg);
    transform: rotate3d(-1, 1, 0, -360deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    opacity: 1;
  }
}

/* rotate-in-2-cw */
.rotInCw {
  -webkit-animation-name: rotInCw;
  animation-name: rotInCw;
}
@-webkit-keyframes rotInCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}
@keyframes rotInCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

/* rotate-in-2-ccw */
.rotInCcw {
  -webkit-animation-name: rotInCcw;
  animation-name: rotInCcw;
}
@-webkit-keyframes rotInCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}
@keyframes rotInCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
}

/* rotate-in-2-tr-cw */
.rotInTrCw {
  -webkit-animation-name: rotInTrCw;
  animation-name: rotInTrCw;
}
@-webkit-keyframes rotInTrCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes rotInTrCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* rotate-in-2-tr-ccw */
.rotInTrCcw {
  -webkit-animation-name: rotInTrCcw;
  animation-name: rotInTrCcw;
}
@-webkit-keyframes rotInTrCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes rotInTrCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* rotate-in-2-br-cw */
.rotInBrCw {
  -webkit-animation-name: rotInBrCw;
  animation-name: rotInBrCw;
}
@-webkit-keyframes rotInBrCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes rotInBrCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* rotate-in-2-br-ccw */
.rotInBrCcw {
  -webkit-animation-name: rotInBrCcw;
  animation-name: rotInBrCcw;
}
@-webkit-keyframes rotInBrCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes rotInBrCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* rotate-in-2-bl-cw */
.rotInBlCw {
  -webkit-animation-name: rotInBlCw;
  animation-name: rotInBlCw;
}
@-webkit-keyframes rotInBlCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}
@keyframes rotInBlCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}

/* rotate-in-2-bl-ccw */
.rotInBlCcw {
  -webkit-animation-name: rotInBlCcw;
  animation-name: rotInBlCcw;
}
@-webkit-keyframes rotInBlCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}
@keyframes rotInBlCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}

/* rotate-in-2-tl-cw */
.rotInTlCw {
  -webkit-animation-name: rotInTlCw;
  animation-name: rotInTlCw;
}
@-webkit-keyframes rotInTlCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}
@keyframes rotInTlCw {
  0% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}

/* rotate-in-2-tl-ccw */
.rotInTlCcw {
  -webkit-animation-name: rotInTlCcw;
  animation-name: rotInTlCcw;
}
@-webkit-keyframes rotInTlCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}
@keyframes rotInTlCcw {
  0% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}

/* swirl-in-fwd */
.swInF {
  -webkit-animation-name: swInF;
  animation-name: swInF;
}
@-webkit-keyframes swInF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
}
@keyframes swInF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
}

/* swirl-in-bck */
.swInB {
  -webkit-animation-name: swInB;
  animation-name: swInB;
}
@-webkit-keyframes swInB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
}
@keyframes swInB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
}

/* swirl-in-top-fwd */
.swInTpF {
  -webkit-animation-name: swInTpF;
  animation-name: swInTpF;
}
@-webkit-keyframes swInTpF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 1;
  }
}
@keyframes swInTpF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 1;
  }
}

/* swirl-in-top-bck */
.swInTpB {
  -webkit-animation-name: swInTpB;
  animation-name: swInTpB;
}
@-webkit-keyframes swInTpB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 1;
  }
}
@keyframes swInTpB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    opacity: 1;
  }
}

/* swirl-in-tr-fwd */
.swInTrF {
  -webkit-animation-name: swInTrF;
  animation-name: swInTrF;
}
@-webkit-keyframes swInTrF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes swInTrF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* swirl-in-tr-bck */
.swInTrB {
  -webkit-animation-name: swInTrB;
  animation-name: swInTrB;
}
@-webkit-keyframes swInTrB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes swInTrB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* swirl-in-right-fwd */
.swInRgtF {
  -webkit-animation-name: swInRgtF;
  animation-name: swInRgtF;
}
@-webkit-keyframes swInRgtF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}
@keyframes swInRgtF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}

/* swirl-in-right-bck */
.swInRgtB {
  -webkit-animation-name: swInRgtB;
  animation-name: swInRgtB;
}
@-webkit-keyframes swInRgtB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}
@keyframes swInRgtB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}

/* swirl-in-br-fwd */
.swInBrF {
  -webkit-animation-name: swInBrF;
  animation-name: swInBrF;
}
@-webkit-keyframes swInBrF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes swInBrF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* swirl-in-br-bck */
.swInBrB {
  -webkit-animation-name: swInBrB;
  animation-name: swInBrB;
}
@-webkit-keyframes swInBrB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes swInBrB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* swirl-in-bottom-fwd */
.swInBtmF {
  -webkit-animation-name: swInBtmF;
  animation-name: swInBtmF;
}
@-webkit-keyframes swInBtmF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}
@keyframes swInBtmF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}

/* swirl-in-bottom-bck */
.swInBtmB {
  -webkit-animation-name: swInBtmB;
  animation-name: swInBtmB;
}
@-webkit-keyframes swInBtmB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}
@keyframes swInBtmB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}

/* swirl-in-bl-fwd */
.swInBlF {
  -webkit-animation-name: swInBlF;
  animation-name: swInBlF;
}
@-webkit-keyframes swInBlF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}
@keyframes swInBlF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}

/* swirl-in-bl-bck */
.swInBlB {
  -webkit-animation-name: swInBlB;
  animation-name: swInBlB;
}
@-webkit-keyframes swInBlB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}
@keyframes swInBlB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
}

/* swirl-in-left-fwd */
.swInLftF {
  -webkit-animation-name: swInLftF;
  animation-name: swInLftF;
}
@-webkit-keyframes swInLftF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
}
@keyframes swInLftF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
}

/* swirl-in-left-bck */
.swInLftB {
  -webkit-animation-name: swInLftB;
  animation-name: swInLftB;
}
@-webkit-keyframes swInLftB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
}
@keyframes swInLftB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
}

/* swirl-in-tl-bck */
.swInTlB {
  -webkit-animation-name: swInTlB;
  animation-name: swInTlB;
}
@-webkit-keyframes swInTlB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}
@keyframes swInTlB {
  0% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}

/* swirl-in-tl-fwd */
.swInTlF {
  -webkit-animation-name: swInTlF;
  animation-name: swInTlF;
}
@-webkit-keyframes swInTlF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}
@keyframes swInTlF {
  0% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}

/* flip-in-hor-bottom */
.flpInXBtm {
  -webkit-animation-name: flpInXBtm;
  animation-name: flpInXBtm;
}
@-webkit-keyframes flpInXBtm {
  0% {
    -webkit-transform: rotateX(80deg);
    transform: rotateX(80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
}
@keyframes flpInXBtm {
  0% {
    -webkit-transform: rotateX(80deg);
    transform: rotateX(80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
}

/* flip-in-hor-top */
.flpInXTp {
  -webkit-animation-name: flpInXTp;
  animation-name: flpInXTp;
}
@-webkit-keyframes flpInXTp {
  0% {
    -webkit-transform: rotateX(-80deg);
    transform: rotateX(-80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
}
@keyframes flpInXTp {
  0% {
    -webkit-transform: rotateX(-80deg);
    transform: rotateX(-80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
}

/* flip-in-ver-right */
.flpInYRgt {
  -webkit-animation-name: flpInYRgt;
  animation-name: flpInYRgt;
}
@-webkit-keyframes flpInYRgt {
  0% {
    -webkit-transform: rotateY(-80deg);
    transform: rotateY(-80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
}
@keyframes flpInYRgt {
  0% {
    -webkit-transform: rotateY(-80deg);
    transform: rotateY(-80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
}

/* flip-in-ver-left */
.flpInYLft {
  -webkit-animation-name: flpInYLft;
  animation-name: flpInYLft;
}
@-webkit-keyframes flpInYLft {
  0% {
    -webkit-transform: rotateY(80deg);
    transform: rotateY(80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
}
@keyframes flpInYLft {
  0% {
    -webkit-transform: rotateY(80deg);
    transform: rotateY(80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
}

/* flip-in-diag-1-tr */
.flpInDgnlTr {
  -webkit-animation-name: flpInDgnlTr;
  animation-name: flpInDgnlTr;
}
@-webkit-keyframes flpInDgnlTr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, -80deg);
    transform: rotate3d(1, 1, 0, -80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}
@keyframes flpInDgnlTr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, -80deg);
    transform: rotate3d(1, 1, 0, -80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}

/* flip-in-diag-1-bl */
.flpInDgnlBl {
  -webkit-animation-name: flpInDgnlBl;
  animation-name: flpInDgnlBl;
}
@-webkit-keyframes flpInDgnlBl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 80deg);
    transform: rotate3d(1, 1, 0, 80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}
@keyframes flpInDgnlBl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 80deg);
    transform: rotate3d(1, 1, 0, 80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}

/* flip-in-diag-2-tl */
.flpInDgnlTl {
  -webkit-animation-name: flpInDgnlTl;
  animation-name: flpInDgnlTl;
}
@-webkit-keyframes flpInDgnlTl {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 80deg);
    transform: rotate3d(-1, 1, 0, 80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}
@keyframes flpInDgnlTl {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 80deg);
    transform: rotate3d(-1, 1, 0, 80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}

/* flip-in-diag-2-br */
.flpInDgnlBr {
  -webkit-animation-name: flpInDgnlBr;
  animation-name: flpInDgnlBr;
}
@-webkit-keyframes flpInDgnlBr {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, -80deg);
    transform: rotate3d(-1, 1, 0, -80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}
@keyframes flpInDgnlBr {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, -80deg);
    transform: rotate3d(-1, 1, 0, -80deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
}

/* slit-in-vertical */
.sltInY {
  -webkit-animation-name: sltInY;
  animation-name: sltInY;
}
@-webkit-keyframes sltInY {
  0% {
    -webkit-transform: translateZ(-800px) rotateY(90deg);
    transform: translateZ(-800px) rotateY(90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateY(87deg);
    transform: translateZ(-160px) rotateY(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotateY(0);
    transform: translateZ(0) rotateY(0);
  }
}
@keyframes sltInY {
  0% {
    -webkit-transform: translateZ(-800px) rotateY(90deg);
    transform: translateZ(-800px) rotateY(90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateY(87deg);
    transform: translateZ(-160px) rotateY(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotateY(0);
    transform: translateZ(0) rotateY(0);
  }
}

/* slit-in-horizontal */
.sltInX {
  -webkit-animation-name: sltInX;
  animation-name: sltInX;
}
@-webkit-keyframes sltInX {
  0% {
    -webkit-transform: translateZ(-800px) rotateX(90deg);
    transform: translateZ(-800px) rotateX(90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateX(87deg);
    transform: translateZ(-160px) rotateX(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotateX(0);
    transform: translateZ(0) rotateX(0);
  }
}
@keyframes sltInX {
  0% {
    -webkit-transform: translateZ(-800px) rotateX(90deg);
    transform: translateZ(-800px) rotateX(90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateX(87deg);
    transform: translateZ(-160px) rotateX(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotateX(0);
    transform: translateZ(0) rotateX(0);
  }
}

/* slit-in-diagonal-1 */
.sltInDgnlLft {
  -webkit-animation-name: sltInDgnlLft;
  animation-name: sltInDgnlLft;
}
@-webkit-keyframes sltInDgnlLft {
  0% {
    -webkit-transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotate3d(1, 1, 0, 0);
    transform: translateZ(0) rotate3d(1, 1, 0, 0);
  }
}
@keyframes sltInDgnlLft {
  0% {
    -webkit-transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotate3d(1, 1, 0, 0);
    transform: translateZ(0) rotate3d(1, 1, 0, 0);
  }
}

/* slit-in-diagonal-2 */
.sltInDgnlRgt {
  -webkit-animation-name: sltInDgnlRgt;
  animation-name: sltInDgnlRgt;
}
@-webkit-keyframes sltInDgnlRgt {
  0% {
    -webkit-transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotate3d(-1, 1, 0, 0);
    transform: translateZ(0) rotate3d(-1, 1, 0, 0);
  }
}
@keyframes sltInDgnlRgt {
  0% {
    -webkit-transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    opacity: 0;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(0) rotate3d(-1, 1, 0, 0);
    transform: translateZ(0) rotate3d(-1, 1, 0, 0);
  }
}

/* slide-in-top */
.sldInTop {
  -webkit-animation-name: sldInTop;
  animation-name: sldInTop;
}
@-webkit-keyframes sldInTop {
  0% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes sldInTop {
  0% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

/* slide-in-tr */
.sldInTr {
  -webkit-animation-name: sldInTr;
  animation-name: sldInTr;
}
@-webkit-keyframes sldInTr {
  0% {
    -webkit-transform: translateY(-1000px) translateX(1000px);
    transform: translateY(-1000px) translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes sldInTr {
  0% {
    -webkit-transform: translateY(-1000px) translateX(1000px);
    transform: translateY(-1000px) translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}

/* slide-in-right */
.sldInRight {
  -webkit-animation-name: sldInRight;
  animation-name: sldInRight;
}
@-webkit-keyframes sldInRight {
  0% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes sldInRight {
  0% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

/* slide-in-br */
.sldInBr {
  -webkit-animation-name: sldInBr;
  animation-name: sldInBr;
}
@-webkit-keyframes sldInBr {
  0% {
    -webkit-transform: translateY(1000px) translateX(1000px);
    transform: translateY(1000px) translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes sldInBr {
  0% {
    -webkit-transform: translateY(1000px) translateX(1000px);
    transform: translateY(1000px) translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}

/* slide-in-bottom */
.sldInBottom {
  -webkit-animation-name: sldInBottom;
  animation-name: sldInBottom;
}
@-webkit-keyframes sldInBottom {
  0% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes sldInBottom {
  0% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

/* slide-in-bl */
.sldInBl {
  -webkit-animation-name: sldInBl;
  animation-name: sldInBl;
}
@-webkit-keyframes sldInBl {
  0% {
    -webkit-transform: translateY(1000px) translateX(-1000px);
    transform: translateY(1000px) translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes sldInBl {
  0% {
    -webkit-transform: translateY(1000px) translateX(-1000px);
    transform: translateY(1000px) translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}

/* slide-in-left */
.sldInLeft {
  -webkit-animation-name: sldInLeft;
  animation-name: sldInLeft;
}
@-webkit-keyframes sldInLeft {
  0% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes sldInLeft {
  0% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

/* slide-in-tl */
.sldInTl {
  -webkit-animation-name: sldInTl;
  animation-name: sldInTl;
}
@-webkit-keyframes sldInTl {
  0% {
    -webkit-transform: translateY(-1000px) translateX(-1000px);
    transform: translateY(-1000px) translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes sldInTl {
  0% {
    -webkit-transform: translateY(-1000px) translateX(-1000px);
    transform: translateY(-1000px) translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}

/* slide-in-blurred-top */
.sldInBlrTp {
  -webkit-animation-name: sldInBlrTp;
  animation-name: sldInBlrTp;
}
@-webkit-keyframes sldInBlrTp {
  0% {
    -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrTp {
  0% {
    -webkit-transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    transform: translateY(-1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-blurred-tr */
.sldInBlrTr {
  -webkit-animation-name: sldInBlrTr;
  animation-name: sldInBlrTr;
}
@-webkit-keyframes sldInBlrTr {
  0% {
    -webkit-transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrTr {
  0% {
    -webkit-transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-blurred-right */
.sldInBlrRgt {
  -webkit-animation-name: sldInBlrRgt;
  animation-name: sldInBlrRgt;
}
@-webkit-keyframes sldInBlrRgt {
  0% {
    -webkit-transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
    transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrRgt {
  0% {
    -webkit-transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
    transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-blurred-br */
.sldInBlrBr {
  -webkit-animation-name: sldInBlrBr;
  animation-name: sldInBlrBr;
}
@-webkit-keyframes sldInBlrBr {
  0% {
    -webkit-transform: translate(1000px, 1000px) skew(80deg, 10deg);
    transform: translate(1000px, 1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrBr {
  0% {
    -webkit-transform: translate(1000px, 1000px) skew(80deg, 10deg);
    transform: translate(1000px, 1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-blurred-bottom */
.sldInBlrBtm {
  -webkit-animation-name: sldInBlrBtm;
  animation-name: sldInBlrBtm;
}
@-webkit-keyframes sldInBlrBtm {
  0% {
    -webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
    transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrBtm {
  0% {
    -webkit-transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
    transform: translateY(1000px) scaleY(2.5) scaleX(0.2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-blurred-bl */
.sldInBlrBl {
  -webkit-animation-name: sldInBlrBl;
  animation-name: sldInBlrBl;
}
@-webkit-keyframes sldInBlrBl {
  0% {
    -webkit-transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrBl {
  0% {
    -webkit-transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-blurred-left */
.sldInBlrLft {
  -webkit-animation-name: sldInBlrLft;
  animation-name: sldInBlrLft;
}
@-webkit-keyframes sldInBlrLft {
  0% {
    -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
    transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrLft {
  0% {
    -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
    transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-blurred-tl */
.sldInBlrTl {
  -webkit-animation-name: sldInBlrTl;
  animation-name: sldInBlrTl;
}
@-webkit-keyframes sldInBlrTl {
  0% {
    -webkit-transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes sldInBlrTl {
  0% {
    -webkit-transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* slide-in-elliptic-top-fwd */
.sldInElptTpF {
  -webkit-animation-name: sldInElptTpF;
  animation-name: sldInElptTpF;
}
@-webkit-keyframes sldInElptTpF {
  0% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
    transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
    transform-origin: 50% 1400px;
    opacity: 1;
  }
}
@keyframes sldInElptTpF {
  0% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
    transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
    transform-origin: 50% 1400px;
    opacity: 1;
  }
}

/* slide-in-elliptic-top-bck */
.sldInElptTpB {
  -webkit-animation-name: sldInElptTpB;
  animation-name: sldInElptTpB;
}
@-webkit-keyframes sldInElptTpB {
  0% {
    -webkit-transform: translateY(-600px) rotateX(30deg) scale(6.5);
    transform: translateY(-600px) rotateX(30deg) scale(6.5);
    -webkit-transform-origin: 50% 200%;
    transform-origin: 50% 200%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -500px;
    transform-origin: 50% -500px;
    opacity: 1;
  }
}
@keyframes sldInElptTpB {
  0% {
    -webkit-transform: translateY(-600px) rotateX(30deg) scale(6.5);
    transform: translateY(-600px) rotateX(30deg) scale(6.5);
    -webkit-transform-origin: 50% 200%;
    transform-origin: 50% 200%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -500px;
    transform-origin: 50% -500px;
    opacity: 1;
  }
}

/* slide-in-elliptic-right-fwd */
.sldInElptRgtF {
  -webkit-animation-name: sldInElptRgtF;
  animation-name: sldInElptRgtF;
}
@-webkit-keyframes sldInElptRgtF {
  0% {
    -webkit-transform: translateX(800px) rotateY(-30deg) scale(0);
    transform: translateX(800px) rotateY(-30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -1800px 50%;
    transform-origin: -1800px 50%;
    opacity: 1;
  }
}
@keyframes sldInElptRgtF {
  0% {
    -webkit-transform: translateX(800px) rotateY(-30deg) scale(0);
    transform: translateX(800px) rotateY(-30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -1800px 50%;
    transform-origin: -1800px 50%;
    opacity: 1;
  }
}

/* slide-in-elliptic-right-bck */
.sldInElptRgtB {
  -webkit-animation-name: sldInElptRgtB;
  animation-name: sldInElptRgtB;
}
@-webkit-keyframes sldInElptRgtB {
  0% {
    -webkit-transform: translateX(800px) rotateY(30deg) scale(6.5);
    transform: translateX(800px) rotateY(30deg) scale(6.5);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 600px 50%;
    transform-origin: 600px 50%;
    opacity: 1;
  }
}
@keyframes sldInElptRgtB {
  0% {
    -webkit-transform: translateX(800px) rotateY(30deg) scale(6.5);
    transform: translateX(800px) rotateY(30deg) scale(6.5);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 600px 50%;
    transform-origin: 600px 50%;
    opacity: 1;
  }
}

/* slide-in-elliptic-bottom-fwd */
.sldInElptBtmF {
  -webkit-animation-name: sldInElptBtmF;
  animation-name: sldInElptBtmF;
}
@-webkit-keyframes sldInElptBtmF {
  0% {
    -webkit-transform: translateY(600px) rotateX(30deg) scale(0);
    transform: translateY(600px) rotateX(30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -1400px;
    transform-origin: 50% -1400px;
    opacity: 1;
  }
}
@keyframes sldInElptBtmF {
  0% {
    -webkit-transform: translateY(600px) rotateX(30deg) scale(0);
    transform: translateY(600px) rotateX(30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -1400px;
    transform-origin: 50% -1400px;
    opacity: 1;
  }
}

/* slide-in-elliptic-bottom-bck */
.sldInElptBtmB {
  -webkit-animation-name: sldInElptBtmB;
  animation-name: sldInElptBtmB;
}
@-webkit-keyframes sldInElptBtmB {
  0% {
    -webkit-transform: translateY(600px) rotateX(-30deg) scale(6.5);
    transform: translateY(600px) rotateX(-30deg) scale(6.5);
    -webkit-transform-origin: 50% -100%;
    transform-origin: 50% -100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 500px;
    transform-origin: 50% 500px;
    opacity: 1;
  }
}
@keyframes sldInElptBtmB {
  0% {
    -webkit-transform: translateY(600px) rotateX(-30deg) scale(6.5);
    transform: translateY(600px) rotateX(-30deg) scale(6.5);
    -webkit-transform-origin: 50% -100%;
    transform-origin: 50% -100%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 500px;
    transform-origin: 50% 500px;
    opacity: 1;
  }
}

/* slide-in-elliptic-left-fwd */
.sldInElptLftF {
  -webkit-animation-name: sldInElptLftF;
  animation-name: sldInElptLftF;
}
@-webkit-keyframes sldInElptLftF {
  0% {
    -webkit-transform: translateX(-800px) rotateY(30deg) scale(0);
    transform: translateX(-800px) rotateY(30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 1800px 50%;
    transform-origin: 1800px 50%;
    opacity: 1;
  }
}
@keyframes sldInElptLftF {
  0% {
    -webkit-transform: translateX(-800px) rotateY(30deg) scale(0);
    transform: translateX(-800px) rotateY(30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 1800px 50%;
    transform-origin: 1800px 50%;
    opacity: 1;
  }
}

/* slide-in-elliptic-left-bck */
.sldInElptLftB {
  -webkit-animation-name: sldInElptLftB;
  animation-name: sldInElptLftB;
}
@-webkit-keyframes sldInElptLftB {
  0% {
    -webkit-transform: translateX(-800px) rotateY(-30deg) scale(6.5);
    transform: translateX(-800px) rotateY(-30deg) scale(6.5);
    -webkit-transform-origin: 200% 50%;
    transform-origin: 200% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -600px 50%;
    transform-origin: -600px 50%;
    opacity: 1;
  }
}
@keyframes sldInElptLftB {
  0% {
    -webkit-transform: translateX(-800px) rotateY(-30deg) scale(6.5);
    transform: translateX(-800px) rotateY(-30deg) scale(6.5);
    -webkit-transform-origin: 200% 50%;
    transform-origin: 200% 50%;
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -600px 50%;
    transform-origin: -600px 50%;
    opacity: 1;
  }
}

/* bounce-in-top */
.boncInTp {
  -webkit-animation-name: boncInTp;
  animation-name: boncInTp;
}
@-webkit-keyframes boncInTp {
  0% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
    transform: translateY(-65px);
  }
  72% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  81% {
    -webkit-transform: translateY(-28px);
    transform: translateY(-28px);
  }
  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  95% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes boncInTp {
  0% {
    -webkit-transform: translateY(-500px);
    transform: translateY(-500px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
    transform: translateY(-65px);
  }
  72% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  81% {
    -webkit-transform: translateY(-28px);
    transform: translateY(-28px);
  }
  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  95% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* bounce-in-right */
.boncInRgt {
  -webkit-animation-name: boncInRgt;
  animation-name: boncInRgt;
}
@-webkit-keyframes boncInRgt {
  0% {
    -webkit-transform: translateX(600px);
    transform: translateX(600px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateX(68px);
    transform: translateX(68px);
  }
  72% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  81% {
    -webkit-transform: translateX(32px);
    transform: translateX(32px);
  }
  90% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  95% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes boncInRgt {
  0% {
    -webkit-transform: translateX(600px);
    transform: translateX(600px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateX(68px);
    transform: translateX(68px);
  }
  72% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  81% {
    -webkit-transform: translateX(32px);
    transform: translateX(32px);
  }
  90% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  95% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* bounce-in-bottom */
.boncInBtm {
  -webkit-animation-name: boncInBtm;
  animation-name: boncInBtm;
}
@-webkit-keyframes boncInBtm {
  0% {
    -webkit-transform: translateY(500px);
    transform: translateY(500px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(65px);
    transform: translateY(65px);
  }
  72% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  81% {
    -webkit-transform: translateY(28px);
    transform: translateY(28px);
  }
  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  95% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes boncInBtm {
  0% {
    -webkit-transform: translateY(500px);
    transform: translateY(500px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(65px);
    transform: translateY(65px);
  }
  72% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  81% {
    -webkit-transform: translateY(28px);
    transform: translateY(28px);
  }
  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  95% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

/* bounce-in-left */
.boncInLft {
  -webkit-animation-name: boncInLft;
  animation-name: boncInLft;
}
@-webkit-keyframes boncInLft {
  0% {
    -webkit-transform: translateX(-600px);
    transform: translateX(-600px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateX(-68px);
    transform: translateX(-68px);
  }
  72% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  81% {
    -webkit-transform: translateX(-28px);
    transform: translateX(-28px);
  }
  90% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  95% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes boncInLft {
  0% {
    -webkit-transform: translateX(-600px);
    transform: translateX(-600px);
    opacity: 0;
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  55% {
    -webkit-transform: translateX(-68px);
    transform: translateX(-68px);
  }
  72% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  81% {
    -webkit-transform: translateX(-28px);
    transform: translateX(-28px);
  }
  90% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  95% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* bounce-in-fwd */
.boncInFwd {
  -webkit-animation-name: boncInFwd;
  animation-name: boncInFwd;
}
@-webkit-keyframes boncInFwd {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
  }
  38% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
  72% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  81% {
    -webkit-transform: scale(0.84);
    transform: scale(0.84);
  }
  89% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  95% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes boncInFwd {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 0;
  }
  38% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(0.7);
    transform: scale(0.7);
  }
  72% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  81% {
    -webkit-transform: scale(0.84);
    transform: scale(0.84);
  }
  89% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  95% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* bounce-in-bck */
.boncInBck {
  -webkit-animation-name: boncInBck;
  animation-name: boncInBck;
}
@-webkit-keyframes boncInBck {
  0% {
    -webkit-transform: scale(7);
    transform: scale(7);
    opacity: 0;
  }
  38% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
  72% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  81% {
    -webkit-transform: scale(1.24);
    transform: scale(1.24);
  }
  89% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  95% {
    -webkit-transform: scale(1.04);
    transform: scale(1.04);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes boncInBck {
  0% {
    -webkit-transform: scale(7);
    transform: scale(7);
    opacity: 0;
  }
  38% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  55% {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
  }
  72% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  81% {
    -webkit-transform: scale(1.24);
    transform: scale(1.24);
  }
  89% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  95% {
    -webkit-transform: scale(1.04);
    transform: scale(1.04);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* roll-in-left */
.rolInLft {
  -webkit-animation-name: rolInLft;
  animation-name: rolInLft;
}
@-webkit-keyframes rolInLft {
  0% {
    -webkit-transform: translateX(-800px) rotate(-540deg);
    transform: translateX(-800px) rotate(-540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
}
@keyframes rolInLft {
  0% {
    -webkit-transform: translateX(-800px) rotate(-540deg);
    transform: translateX(-800px) rotate(-540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
}

/* roll-in-top */
.rolInTp {
  -webkit-animation-name: rolInTp;
  animation-name: rolInTp;
}
@-webkit-keyframes rolInTp {
  0% {
    -webkit-transform: translateY(-800px) rotate(-540deg);
    transform: translateY(-800px) rotate(-540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
}
@keyframes rolInTp {
  0% {
    -webkit-transform: translateY(-800px) rotate(-540deg);
    transform: translateY(-800px) rotate(-540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
}

/* roll-in-right */
.rolInRgt {
  -webkit-animation-name: rolInRgt;
  animation-name: rolInRgt;
}
@-webkit-keyframes rolInRgt {
  0% {
    -webkit-transform: translateX(800px) rotate(540deg);
    transform: translateX(800px) rotate(540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
}
@keyframes rolInRgt {
  0% {
    -webkit-transform: translateX(800px) rotate(540deg);
    transform: translateX(800px) rotate(540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
}

/* roll-in-bottom */
.rolInBtm {
  -webkit-animation-name: rolInBtm;
  animation-name: rolInBtm;
}
@-webkit-keyframes rolInBtm {
  0% {
    -webkit-transform: translateY(800px) rotate(540deg);
    transform: translateY(800px) rotate(540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
}
@keyframes rolInBtm {
  0% {
    -webkit-transform: translateY(800px) rotate(540deg);
    transform: translateY(800px) rotate(540deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
}

/* roll-in-blurred-left */
.rolInBlrLft {
  -webkit-animation-name: rolInBlrLft;
  animation-name: rolInBlrLft;
}
@-webkit-keyframes rolInBlrLft {
  0% {
    -webkit-transform: translateX(-1000px) rotate(-720deg);
    transform: translateX(-1000px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes rolInBlrLft {
  0% {
    -webkit-transform: translateX(-1000px) rotate(-720deg);
    transform: translateX(-1000px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* roll-in-blurred-top */
.rolInBlrTp {
  -webkit-animation-name: rolInBlrTp;
  animation-name: rolInBlrTp;
}
@-webkit-keyframes rolInBlrTp {
  0% {
    -webkit-transform: translateY(-800px) rotate(-720deg);
    transform: translateY(-800px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes rolInBlrTp {
  0% {
    -webkit-transform: translateY(-800px) rotate(-720deg);
    transform: translateY(-800px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* roll-in-blurred-right */
.rolInBlrRgt {
  -webkit-animation-name: rolInBlrRgt;
  animation-name: rolInBlrRgt;
}
@-webkit-keyframes rolInBlrRgt {
  0% {
    -webkit-transform: translateX(1000px) rotate(720deg);
    transform: translateX(1000px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes rolInBlrRgt {
  0% {
    -webkit-transform: translateX(1000px) rotate(720deg);
    transform: translateX(1000px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* roll-in-blurred-bottom */
.rolInBlrBtm {
  -webkit-animation-name: rolInBlrBtm;
  animation-name: rolInBlrBtm;
}
@-webkit-keyframes rolInBlrBtm {
  0% {
    -webkit-transform: translateY(800px) rotate(720deg);
    transform: translateY(800px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
}
@keyframes rolInBlrBtm {
  0% {
    -webkit-transform: translateY(800px) rotate(720deg);
    transform: translateY(800px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
}

/* tilt-in-top-1 */
.tltInTpLft {
  -webkit-animation-name: tltInTpLft;
  animation-name: tltInTpLft;
}
@-webkit-keyframes tltInTpLft {
  0% {
    -webkit-transform: rotateY(30deg) translateY(-300px) skewY(-30deg);
    transform: rotateY(30deg) translateY(-300px) skewY(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}
@keyframes tltInTpLft {
  0% {
    -webkit-transform: rotateY(30deg) translateY(-300px) skewY(-30deg);
    transform: rotateY(30deg) translateY(-300px) skewY(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}

/* tilt-in-top-2 */
.tltInTpRgt {
  -webkit-animation-name: tltInTpRgt;
  animation-name: tltInTpRgt;
}
@-webkit-keyframes tltInTpRgt {
  0% {
    -webkit-transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}
@keyframes tltInTpRgt {
  0% {
    -webkit-transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    transform: rotateY(-30deg) translateY(-300px) skewY(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}

/* tilt-in-tr */
.tltInTr {
  -webkit-animation-name: tltInTr;
  animation-name: tltInTr;
}
@-webkit-keyframes tltInTr {
  0% {
    -webkit-transform: rotateY(-35deg) rotateX(20deg) translate(250px, -250px) skew(-12deg, -15deg);
    transform: rotateY(-35deg) rotateX(20deg) translate(250px, -250px) skew(-12deg, -15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}
@keyframes tltInTr {
  0% {
    -webkit-transform: rotateY(-35deg) rotateX(20deg) translate(250px, -250px) skew(-12deg, -15deg);
    transform: rotateY(-35deg) rotateX(20deg) translate(250px, -250px) skew(-12deg, -15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}

/* tilt-in-right-1 */
.tltInRgt {
  -webkit-animation-name: tltInRgt;
  animation-name: tltInRgt;
}
@-webkit-keyframes tltInRgt {
  0% {
    -webkit-transform: rotateX(-30deg) translateX(300px) skewX(30deg);
    transform: rotateX(-30deg) translateX(300px) skewX(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}
@keyframes tltInRgt {
  0% {
    -webkit-transform: rotateX(-30deg) translateX(300px) skewX(30deg);
    transform: rotateX(-30deg) translateX(300px) skewX(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}

/* tilt-in-right-2 */
.tltInRgts {
  -webkit-animation-name: tltInRgts;
  animation-name: tltInRgts;
}
@-webkit-keyframes tltInRgts {
  0% {
    -webkit-transform: rotateX(30deg) translateX(300px) skewX(-30deg);
    transform: rotateX(30deg) translateX(300px) skewX(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}
@keyframes tltInRgts {
  0% {
    -webkit-transform: rotateX(30deg) translateX(300px) skewX(-30deg);
    transform: rotateX(30deg) translateX(300px) skewX(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}

/* tilt-in-br */
.tltInBr {
  -webkit-animation-name: tltInBr;
  animation-name: tltInBr;
}
@-webkit-keyframes tltInBr {
  0% {
    -webkit-transform: rotateY(-35deg) rotateX(-20deg) translate(250px, 250px) skew(12deg, 15deg);
    transform: rotateY(-35deg) rotateX(-20deg) translate(250px, 250px) skew(12deg, 15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}
@keyframes tltInBr {
  0% {
    -webkit-transform: rotateY(-35deg) rotateX(-20deg) translate(250px, 250px) skew(12deg, 15deg);
    transform: rotateY(-35deg) rotateX(-20deg) translate(250px, 250px) skew(12deg, 15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}

/* tilt-in-bottom-1 */
.tltInBtmLft {
  -webkit-animation-name: tltInBtmLft;
  animation-name: tltInBtmLft;
}
@-webkit-keyframes tltInBtmLft {
  0% {
    -webkit-transform: rotateY(30deg) translateY(300px) skewY(-30deg);
    transform: rotateY(30deg) translateY(300px) skewY(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}
@keyframes tltInBtmLft {
  0% {
    -webkit-transform: rotateY(30deg) translateY(300px) skewY(-30deg);
    transform: rotateY(30deg) translateY(300px) skewY(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}

/* tilt-in-bottom-2 */
.tltInBtmRgt {
  -webkit-animation-name: tltInBtmRgt;
  animation-name: tltInBtmRgt;
}
@-webkit-keyframes tltInBtmRgt {
  0% {
    -webkit-transform: rotateY(-30deg) translateY(300px) skewY(30deg);
    transform: rotateY(-30deg) translateY(300px) skewY(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}
@keyframes tltInBtmRgt {
  0% {
    -webkit-transform: rotateY(-30deg) translateY(300px) skewY(30deg);
    transform: rotateY(-30deg) translateY(300px) skewY(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0deg) translateY(0) skewY(0deg);
    transform: rotateY(0deg) translateY(0) skewY(0deg);
    opacity: 1;
  }
}

/* tilt-in-bl */
.tltInBl {
  -webkit-animation-name: tltInBl;
  animation-name: tltInBl;
}
@-webkit-keyframes tltInBl {
  0% {
    -webkit-transform: rotateY(35deg) rotateX(-20deg) translate(-250px, 250px) skew(-12deg, -15deg);
    transform: rotateY(35deg) rotateX(-20deg) translate(-250px, 250px) skew(-12deg, -15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}
@keyframes tltInBl {
  0% {
    -webkit-transform: rotateY(35deg) rotateX(-20deg) translate(-250px, 250px) skew(-12deg, -15deg);
    transform: rotateY(35deg) rotateX(-20deg) translate(-250px, 250px) skew(-12deg, -15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}

/* tilt-in-left-1 */
.tltInLft {
  -webkit-animation-name: tltInLft;
  animation-name: tltInLft;
}
@-webkit-keyframes tltInLft {
  0% {
    -webkit-transform: rotateX(-30deg) translateX(-300px) skewX(-30deg);
    transform: rotateX(-30deg) translateX(-300px) skewX(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}
@keyframes tltInLft {
  0% {
    -webkit-transform: rotateX(-30deg) translateX(-300px) skewX(-30deg);
    transform: rotateX(-30deg) translateX(-300px) skewX(-30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}

/* tilt-in-left-2 */
.tltInLfts {
  -webkit-animation-name: tltInLfts;
  animation-name: tltInLfts;
}
@-webkit-keyframes tltInLfts {
  0% {
    -webkit-transform: rotateX(30deg) translateX(-300px) skewX(30deg);
    transform: rotateX(30deg) translateX(-300px) skewX(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}
@keyframes tltInLfts {
  0% {
    -webkit-transform: rotateX(30deg) translateX(-300px) skewX(30deg);
    transform: rotateX(30deg) translateX(-300px) skewX(30deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg) translateX(0) skewX(0deg);
    transform: rotateX(0deg) translateX(0) skewX(0deg);
    opacity: 1;
  }
}

/* tilt-in-tl */
.tltInTl {
  -webkit-animation-name: tltInTl;
  animation-name: tltInTl;
}
@-webkit-keyframes tltInTl {
  0% {
    -webkit-transform: rotateY(35deg) rotateX(20deg) translate(-250px, -250px) skew(12deg, 15deg);
    transform: rotateY(35deg) rotateX(20deg) translate(-250px, -250px) skew(12deg, 15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}
@keyframes tltInTl {
  0% {
    -webkit-transform: rotateY(35deg) rotateX(20deg) translate(-250px, -250px) skew(12deg, 15deg);
    transform: rotateY(35deg) rotateX(20deg) translate(-250px, -250px) skew(12deg, 15deg);
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    transform: rotateY(0) rotateX(0deg) translate(0, 0) skew(0deg, 0deg);
    opacity: 1;
  }
}


/* fade-in */
.fdIn {
  -webkit-animation-name: fdIn;
  animation-name: fdIn;
}
@-webkit-keyframes fdIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fdIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* fade-in-top */
.fdInTp {
  -webkit-animation-name: fdInTp;
  animation-name: fdInTp;
}
@-webkit-keyframes fdInTp {
  0% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fdInTp {
  0% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

/* fade-in-tr */
.fdInTr {
  -webkit-animation-name: fdInTr;
  animation-name: fdInTr;
}
@-webkit-keyframes fdInTr {
  0% {
    -webkit-transform: translateX(50px) translateY(-50px);
    transform: translateX(50px) translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}
@keyframes fdInTr {
  0% {
    -webkit-transform: translateX(50px) translateY(-50px);
    transform: translateX(50px) translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}

/* fade-in-right */
.fdInRgt {
  -webkit-animation-name: fdInRgt;
  animation-name: fdInRgt;
}
@-webkit-keyframes fdInRgt {
  0% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fdInRgt {
  0% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

/* fade-in-br */
.fdInBr {
  -webkit-animation-name: fdInBr;
  animation-name: fdInBr;
}
@-webkit-keyframes fdInBr {
  0% {
    -webkit-transform: translateX(50px) translateY(50px);
    transform: translateX(50px) translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}
@keyframes fdInBr {
  0% {
    -webkit-transform: translateX(50px) translateY(50px);
    transform: translateX(50px) translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}

/* fade-in-bottom */
.fdInBtm {
  -webkit-animation-name: fdInBtm;
  animation-name: fdInBtm;
}
@-webkit-keyframes fdInBtm {
  0% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fdInBtm {
  0% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

/* fade-in-bl */
.fdInBl {
  -webkit-animation-name: fdInBl;
  animation-name: fdInBl;
}
@-webkit-keyframes fdInBl {
  0% {
    -webkit-transform: translateX(-50px) translateY(50px);
    transform: translateX(-50px) translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}
@keyframes fdInBl {
  0% {
    -webkit-transform: translateX(-50px) translateY(50px);
    transform: translateX(-50px) translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}

/* fade-in-left */
.fdInLft {
  -webkit-animation-name: fdInLft;
  animation-name: fdInLft;
}
@-webkit-keyframes fdInLft {
  0% {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fdInLft {
  0% {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

/* fade-in-tl */
.fdInTl {
  -webkit-animation-name: fdInTl;
  animation-name: fdInTl;
}
@-webkit-keyframes fdInTl {
  0% {
    -webkit-transform: translateX(-50px) translateY(-50px);
    transform: translateX(-50px) translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}
@keyframes fdInTl {
  0% {
    -webkit-transform: translateX(-50px) translateY(-50px);
    transform: translateX(-50px) translateY(-50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
}

/* puff-in-center */
.pufInCntr {
  -webkit-animation-name: pufInCntr;
  animation-name: pufInCntr;
}
@-webkit-keyframes pufInCntr {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInCntr {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-top */
.pufInTp {
  -webkit-animation-name: pufInTp;
  animation-name: pufInTp;
}
@-webkit-keyframes pufInTp {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInTp {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-tr */
.pufInTr {
  -webkit-animation-name: pufInTr;
  animation-name: pufInTr;
}
@-webkit-keyframes pufInTr {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInTr {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-right */
.pufInRgt {
  -webkit-animation-name: pufInRgt;
  animation-name: pufInRgt;
}
@-webkit-keyframes pufInRgt {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInRgt {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-br */
.pufInBr {
  -webkit-animation-name: pufInBr;
  animation-name: pufInBr;
}
@-webkit-keyframes pufInBr {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInBr {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-bottom */
.pufInBtm {
  -webkit-animation-name: pufInBtm;
  animation-name: pufInBtm;
}
@-webkit-keyframes pufInBtm {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInBtm {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-bl */
.pufInBl {
  -webkit-animation-name: pufInBl;
  animation-name: pufInBl;
}
@-webkit-keyframes pufInBl {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInBl {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-left */
.pufInLft {
  -webkit-animation-name: pufInLft;
  animation-name: pufInLft;
}
@-webkit-keyframes pufInLft {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInLft {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-tl */
.pufInTl {
  -webkit-animation-name: pufInTl;
  animation-name: pufInTl;
}
@-webkit-keyframes pufInTl {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInTl {
  0% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-hor */
.pufInX {
  -webkit-animation-name: pufInX;
  animation-name: pufInX;
}
@-webkit-keyframes pufInX {
  0% {
    -webkit-transform: scaleX(2);
    transform: scaleX(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInX {
  0% {
    -webkit-transform: scaleX(2);
    transform: scaleX(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* puff-in-ver */
.pufInY {
  -webkit-animation-name: pufInY;
  animation-name: pufInY;
}
@-webkit-keyframes pufInY {
  0% {
    -webkit-transform: scaleY(2);
    transform: scaleY(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes pufInY {
  0% {
    -webkit-transform: scaleY(2);
    transform: scaleY(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* scale-out-center */
.sclOutCntr {
  -webkit-animation-name: sclOutCntr;
  animation-name: sclOutCntr;
}
@-webkit-keyframes sclOutCntr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
}
@keyframes sclOutCntr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
}

/* scale-out-top */
.sclOutTp {
  -webkit-animation-name: sclOutTp;
  animation-name: sclOutTp;
}
@-webkit-keyframes sclOutTp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
}
@keyframes sclOutTp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
}

/* scale-out-tr */
.sclOutTr {
  -webkit-animation-name: sclOutTr;
  animation-name: sclOutTr;
}
@-webkit-keyframes sclOutTr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes sclOutTr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* scale-out-right */
.sclOutRgt {
  -webkit-animation-name: sclOutRgt;
  animation-name: sclOutRgt;
}
@-webkit-keyframes sclOutRgt {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}
@keyframes sclOutRgt {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
}

/* scale-out-br */
.sclOutBr {
  -webkit-animation-name: sclOutBr;
  animation-name: sclOutBr;
}
@-webkit-keyframes sclOutBr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes sclOutBr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* scale-out-bottom */
.sclOutBtm {
  -webkit-animation-name: sclOutBtm;
  animation-name: sclOutBtm;
}
@-webkit-keyframes sclOutBtm {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}
@keyframes sclOutBtm {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}

/* scale-out-bl */
.sclOutBl {
  -webkit-animation-name: sclOutBl;
  animation-name: sclOutBl;
}
@-webkit-keyframes sclOutBl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}
@keyframes sclOutBl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}

/* scale-out-left */
.sclOutLft {
  -webkit-animation-name: sclOutLft;
  animation-name: sclOutLft;
}
@-webkit-keyframes sclOutLft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
}
@keyframes sclOutLft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    opacity: 1;
  }
}

/* scale-out-tl */
.sclOutTl {
  -webkit-animation-name: sclOutTl;
  animation-name: sclOutTl;
}
@-webkit-keyframes sclOutTl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}
@keyframes sclOutTl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}

/* scale-out-horizontal */
.sclOutX {
  -webkit-animation-name: sclOutX;
  animation-name: sclOutX;
}
@-webkit-keyframes sclOutX {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    opacity: 1;
  }
}
@keyframes sclOutX {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    opacity: 1;
  }
}

/* scale-out-hor-left */
.sclOutXLft {
  -webkit-animation-name: sclOutXLft;
  animation-name: sclOutXLft;
}
@-webkit-keyframes sclOutXLft {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}
@keyframes sclOutXLft {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
}

/* scale-out-hor-right */
.sclOutXRgt {
  -webkit-animation-name: sclOutXRgt;
  animation-name: sclOutXRgt;
}
@-webkit-keyframes sclOutXRgt {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes sclOutXRgt {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
}

/* scale-out-hor-vertical */
.sclOutY {
  -webkit-animation-name: sclOutY;
  animation-name: sclOutY;
}
@-webkit-keyframes sclOutY {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    opacity: 1;
  }
}
@keyframes sclOutY {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    opacity: 1;
  }
}

/* scale-out-hor-ver-top */
.sclOutYTp {
  -webkit-animation-name: sclOutYTp;
  animation-name: sclOutYTp;
}
@-webkit-keyframes sclOutYTp {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes sclOutYTp {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
}

/* scale-out-hor-ver-bottom */
.sclOutYBtm {
  -webkit-animation-name: sclOutYBtm;
  animation-name: sclOutYBtm;
}
@-webkit-keyframes sclOutYBtm {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}
@keyframes sclOutYBtm {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    opacity: 1;
  }
}

/* rotate-out-center */
.rotOutCntr {
  -webkit-animation-name: rotOutCntr;
  animation-name: rotOutCntr;
}
@-webkit-keyframes rotOutCntr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    opacity: 0;
  }
}
@keyframes rotOutCntr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    opacity: 0;
  }
}

/* rotate-out-top */
.rotOutTp {
  -webkit-animation-name: rotOutTp;
  animation-name: rotOutTp;
}
@-webkit-keyframes rotOutTp {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0;
  }
}
@keyframes rotOutTp {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0;
  }
}

/* rotate-out-tr */
.rotOutTr {
  -webkit-animation-name: rotOutTr;
  animation-name: rotOutTr;
}
@-webkit-keyframes rotOutTr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 0;
  }
}
@keyframes rotOutTr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    opacity: 0;
  }
}

/* rotate-out-right */
.rotOutRgt {
  -webkit-animation-name: rotOutRgt;
  animation-name: rotOutRgt;
}
@-webkit-keyframes rotOutRgt {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 0;
  }
}
@keyframes rotOutRgt {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
    opacity: 0;
  }
}

/* rotate-out-br */
.rotOutBr {
  -webkit-animation-name: rotOutBr;
  animation-name: rotOutBr;
}
@-webkit-keyframes rotOutBr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 0;
  }
}
@keyframes rotOutBr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
    opacity: 0;
  }
}

/* rotate-out-bottom */
.rotOutBtm {
  -webkit-animation-name: rotOutBtm;
  animation-name: rotOutBtm;
}
@-webkit-keyframes rotOutBtm {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 0;
  }
}
@keyframes rotOutBtm {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
    opacity: 0;
  }
}

/* rotate-out-bl */
.rotOutBl {
  -webkit-animation-name: rotOutBl;
  animation-name: rotOutBl;
}
@-webkit-keyframes rotOutBl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 0;
  }
}
@keyframes rotOutBl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
    opacity: 0;
  }
}

/* rotate-out-left */
.rotOutLft {
  -webkit-animation-name: rotOutLft;
  animation-name: rotOutLft;
}
@-webkit-keyframes rotOutLft {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 0;
  }
}
@keyframes rotOutLft {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
    opacity: 0;
  }
}

/* rotate-out-tl */
.rotOutTl {
  -webkit-animation-name: rotOutTl;
  animation-name: rotOutTl;
}
@-webkit-keyframes rotOutTl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 0;
  }
}
@keyframes rotOutTl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    opacity: 0;
  }
}

/* rotate-out-hor */
.rotOutX {
  -webkit-animation-name: rotOutX;
  animation-name: rotOutX;
}
@-webkit-keyframes rotOutX {
  0% {
    -webkit-transform: rotateX(360deg);
    transform: rotateX(360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 0;
  }
}
@keyframes rotOutX {
  0% {
    -webkit-transform: rotateX(360deg);
    transform: rotateX(360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 0;
  }
}

/* rotate-out-ver */
.rotOutY {
  -webkit-animation-name: rotOutY;
  animation-name: rotOutY;
}
@-webkit-keyframes rotOutY {
  0% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    opacity: 0;
  }
}
@keyframes rotOutY {
  0% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    opacity: 0;
  }
}

/* rotate-out-diag-1 */
.rotOutDgnlLft {
  -webkit-animation-name: rotOutDgnlLft;
  animation-name: rotOutDgnlLft;
}
@-webkit-keyframes rotOutDgnlLft {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 360deg);
    transform: rotate3d(1, 1, 0, 360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 0;
  }
}
@keyframes rotOutDgnlLft {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 360deg);
    transform: rotate3d(1, 1, 0, 360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 0;
  }
}

/* rotate-out-diag-2 */
.rotOutDgnlRgt {
  -webkit-animation-name: rotOutDgnlRgt;
  animation-name: rotOutDgnlRgt;
}
@-webkit-keyframes rotOutDgnlRgt {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 360deg);
    transform: rotate3d(-1, 1, 0, 360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    opacity: 0;
  }
}
@keyframes rotOutDgnlRgt {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 360deg);
    transform: rotate3d(-1, 1, 0, 360deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    opacity: 0;
  }
}

/* rotate-out-2-cw */
.rotOutCw {
  -webkit-animation-name: rotOutCw;
  animation-name: rotOutCw;
}
@-webkit-keyframes rotOutCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }
}
@keyframes rotOutCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    opacity: 0;
  }
}

/* rotate-out-2-ccw */
.rotOutCcw {
  -webkit-animation-name: rotOutCcw;
  animation-name: rotOutCcw;
}
@-webkit-keyframes rotOutCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
}
@keyframes rotOutCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    opacity: 0;
  }
}

/* rotate-out-2-tr-cw */
.rotOutTrCw {
  -webkit-animation-name: rotOutTrCw;
  animation-name: rotOutTrCw;
}
@-webkit-keyframes rotOutTrCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}
@keyframes rotOutTrCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}

/* rotate-out-2-tr-ccw */
.rotOutTrCcw {
  -webkit-animation-name: rotOutTrCcw;
  animation-name: rotOutTrCcw;
}
@-webkit-keyframes rotOutTrCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}
@keyframes rotOutTrCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}

/* rotate-out-2-br-cw */
.rotOutBrCw {
  -webkit-animation-name: rotOutBrCw;
  animation-name: rotOutBrCw;
}
@-webkit-keyframes rotOutBrCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}
@keyframes rotOutBrCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}

/* rotate-out-2-br-ccw */
.rotOutBrCcw {
  -webkit-animation-name: rotOutBrCcw;
  animation-name: rotOutBrCcw;
}
@-webkit-keyframes rotOutBrCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}
@keyframes rotOutBrCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}

/* rotate-out-2-bl-cw */
.rotOutBlCw {
  -webkit-animation-name: rotOutBlCw;
  animation-name: rotOutBlCw;
}
@-webkit-keyframes rotOutBlCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}
@keyframes rotOutBlCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}

/* rotate-out-2-bl-ccw */
.rotOutBlCcw {
  -webkit-animation-name: rotOutBlCcw;
  animation-name: rotOutBlCcw;
}
@-webkit-keyframes rotOutBlCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}
@keyframes rotOutBlCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}

/* rotate-out-2-tl-cw */
.rotOutTlCw {
  -webkit-animation-name: rotOutTlCw;
  animation-name: rotOutTlCw;
}
@-webkit-keyframes rotOutTlCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
}
@keyframes rotOutTlCw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
}

/* rotate-out-2-tl-ccw */
.rotOutTlCcw {
  -webkit-animation-name: rotOutTlCcw;
  animation-name: rotOutTlCcw;
}
@-webkit-keyframes rotOutTlCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
}
@keyframes rotOutTlCcw {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
}

/* swirl-out-bck */
.swOutBck {
  -webkit-animation-name: swOutBck;
  animation-name: swOutBck;
}
@-webkit-keyframes swOutBck {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    opacity: 0;
  }
}
@keyframes swOutBck {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    opacity: 0;
  }
}

/* swirl-out-fwd */
.swOutFwd {
  -webkit-animation-name: swOutFwd;
  animation-name: swOutFwd;
}
@-webkit-keyframes swOutFwd {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    opacity: 0;
  }
}
@keyframes swOutFwd {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    opacity: 0;
  }
}

/* swirl-out-top-bck */
.swOutTpB {
  -webkit-animation-name: swOutTpB;
  animation-name: swOutTpB;
}
@-webkit-keyframes swOutTpB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 0;
  }
}
@keyframes swOutTpB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 0;
  }
}

/* swirl-out-top-fwd */
.swOutTpF {
  -webkit-animation-name: swOutTpF;
  animation-name: swOutTpF;
}
@-webkit-keyframes swOutTpF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 0;
  }
}
@keyframes swOutTpF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    opacity: 0;
  }
}

/* swirl-out-tr-bck */
.swOutTrB {
  -webkit-animation-name: swOutTrB;
  animation-name: swOutTrB;
}
@-webkit-keyframes swOutTrB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}
@keyframes swOutTrB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}

/* swirl-out-tr-fwd */
.swOutTrF {
  -webkit-animation-name: swOutTrF;
  animation-name: swOutTrF;
}
@-webkit-keyframes swOutTrF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}
@keyframes swOutTrF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    opacity: 0;
  }
}

/* swirl-out-right-bck */
.swOutRgtB {
  -webkit-animation-name: swOutRgtB;
  animation-name: swOutRgtB;
}
@-webkit-keyframes swOutRgtB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
}
@keyframes swOutRgtB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
}

/* swirl-out-right-fwd */
.swOutRgtF {
  -webkit-animation-name: swOutRgtF;
  animation-name: swOutRgtF;
}
@-webkit-keyframes swOutRgtF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
}
@keyframes swOutRgtF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    opacity: 0;
  }
}

/* swirl-out-br-bck */
.swOutBrB {
  -webkit-animation-name: swOutBrB;
  animation-name: swOutBrB;
}
@-webkit-keyframes swOutBrB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}
@keyframes swOutBrB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}

/* swirl-out-br-fwd */
.swOutBrF {
  -webkit-animation-name: swOutBrF;
  animation-name: swOutBrF;
}
@-webkit-keyframes swOutBrF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}
@keyframes swOutBrF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    opacity: 0;
  }
}

/* swirl-out-bottom-bck */
.swOutBtmB {
  -webkit-animation-name: swOutBtmB;
  animation-name: swOutBtmB;
}
@-webkit-keyframes swOutBtmB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
}
@keyframes swOutBtmB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
}

/* swirl-out-bottom-fwd */
.swOutBtmF {
  -webkit-animation-name: swOutBtmF;
  animation-name: swOutBtmF;
}
@-webkit-keyframes swOutBtmF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
}
@keyframes swOutBtmF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 0;
  }
}

/* swirl-out-bl-bck */
.swOutBlB {
  -webkit-animation-name: swOutBlB;
  animation-name: swOutBlB;
}
@-webkit-keyframes swOutBlB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}
@keyframes swOutBlB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}

/* swirl-out-bl-fwd */
.swOutBlF {
  -webkit-animation-name: swOutBlF;
  animation-name: swOutBlF;
}
@-webkit-keyframes swOutBlF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}
@keyframes swOutBlF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    opacity: 0;
  }
}

/* swirl-out-left-bck */
.swOutLftB {
  -webkit-animation-name: swOutLftB;
  animation-name: swOutLftB;
}
@-webkit-keyframes swOutLftB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
}
@keyframes swOutLftB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
}

/* swirl-out-left-fwd */
.swOutLftF {
  -webkit-animation-name: swOutLftF;
  animation-name: swOutLftF;
}
@-webkit-keyframes swOutLftF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
}
@keyframes swOutLftF {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(540deg) scale(5);
    transform: rotate(540deg) scale(5);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    opacity: 0;
  }
}

/* swirl-out-tl-bck */
.swOutTlB {
  -webkit-animation-name: swOutTlB;
  animation-name: swOutTlB;
}
@-webkit-keyframes swOutTlB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
}
@keyframes swOutTlB {
  0% {
    -webkit-transform: rotate(0) scale(1);
    transform: rotate(0) scale(1);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate(-540deg) scale(0);
    transform: rotate(-540deg) scale(0);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    opacity: 0;
  }
}

/* flip-out-hor-top */
.flpOutXTp {
  -webkit-animation-name: flpOutXTp;
  animation-name: flpOutXTp;
}
@-webkit-keyframes flpOutXTp {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateX(70deg);
    transform: rotateX(70deg);
    opacity: 0;
  }
}
@keyframes flpOutXTp {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateX(70deg);
    transform: rotateX(70deg);
    opacity: 0;
  }
}

/* flip-out-hor-bottom */
.flpOutXBtm {
  -webkit-animation-name: flpOutXBtm;
  animation-name: flpOutXBtm;
}
@-webkit-keyframes flpOutXBtm {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateX(-70deg);
    transform: rotateX(-70deg);
    opacity: 0;
  }
}
@keyframes flpOutXBtm {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateX(-70deg);
    transform: rotateX(-70deg);
    opacity: 0;
  }
}

/* flip-out-ver-left */
.flpOutYLft {
  -webkit-animation-name: flpOutYLft;
  animation-name: flpOutYLft;
}
@-webkit-keyframes flpOutYLft {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateY(-70deg);
    transform: rotateY(-70deg);
    opacity: 0;
  }
}
@keyframes flpOutYLft {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateY(-70deg);
    transform: rotateY(-70deg);
    opacity: 0;
  }
}

/* flip-out-ver-right */
.flpOutYRgt {
  -webkit-animation-name: flpOutYRgt;
  animation-name: flpOutYRgt;
}
@-webkit-keyframes flpOutYRgt {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateY(70deg);
    transform: rotateY(70deg);
    opacity: 0;
  }
}
@keyframes flpOutYRgt {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotateY(70deg);
    transform: rotateY(70deg);
    opacity: 0;
  }
}

/* flip-out-diag-1-tr */
.flpOutDgnlTr {
  -webkit-animation-name: flpOutDgnlTr;
  animation-name: flpOutDgnlTr;
}
@-webkit-keyframes flpOutDgnlTr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 70deg);
    transform: rotate3d(1, 1, 0, 70deg);
    opacity: 0;
  }
}
@keyframes flpOutDgnlTr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 70deg);
    transform: rotate3d(1, 1, 0, 70deg);
    opacity: 0;
  }
}

/* flip-out-diag-1-bl */
.flpOutDgnlBl {
  -webkit-animation-name: flpOutDgnlBl;
  animation-name: flpOutDgnlBl;
}
@-webkit-keyframes flpOutDgnlBl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -70deg);
    transform: rotate3d(1, 1, 0, -70deg);
    opacity: 0;
  }
}
@keyframes flpOutDgnlBl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -70deg);
    transform: rotate3d(1, 1, 0, -70deg);
    opacity: 0;
  }
}

/* flip-out-diag-2-tl */
.flpOutDgnlTl {
  -webkit-animation-name: flpOutDgnlTl;
  animation-name: flpOutDgnlTl;
}
@-webkit-keyframes flpOutDgnlTl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, -70deg);
    transform: rotate3d(-1, 1, 0, -70deg);
    opacity: 0;
  }
}
@keyframes flpOutDgnlTl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, -70deg);
    transform: rotate3d(-1, 1, 0, -70deg);
    opacity: 0;
  }
}

/* flip-out-diag-2-br */
.flpOutDgnlBr {
  -webkit-animation-name: flpOutDgnlBr;
  animation-name: flpOutDgnlBr;
}
@-webkit-keyframes flpOutDgnlBr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 70deg);
    transform: rotate3d(-1, 1, 0, 70deg);
    opacity: 0;
  }
}
@keyframes flpOutDgnlBr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 70deg);
    transform: rotate3d(-1, 1, 0, 70deg);
    opacity: 0;
  }
}

/* slit-out-vertical */
.sltOutY {
  -webkit-animation-name: sltOutY;
  animation-name: sltOutY;
}
@-webkit-keyframes sltOutY {
  0% {
    -webkit-transform: translateZ(0) rotateY(0);
    transform: translateZ(0) rotateY(0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateY(87deg);
    transform: translateZ(-160px) rotateY(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotateY(90deg);
    transform: translateZ(-800px) rotateY(90deg);
    opacity: 0;
  }
}
@keyframes sltOutY {
  0% {
    -webkit-transform: translateZ(0) rotateY(0);
    transform: translateZ(0) rotateY(0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateY(87deg);
    transform: translateZ(-160px) rotateY(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotateY(90deg);
    transform: translateZ(-800px) rotateY(90deg);
    opacity: 0;
  }
}

/* slit-out-horizontal */
.sltOutX {
  -webkit-animation-name: sltOutX;
  animation-name: sltOutX;
}
@-webkit-keyframes sltOutX {
  0% {
    -webkit-transform: translateZ(0) rotateX(0);
    transform: translateZ(0) rotateX(0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateX(87deg);
    transform: translateZ(-160px) rotateX(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotateX(90deg);
    transform: translateZ(-800px) rotateX(90deg);
    opacity: 0;
  }
}
@keyframes sltOutX {
  0% {
    -webkit-transform: translateZ(0) rotateX(0);
    transform: translateZ(0) rotateX(0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotateX(87deg);
    transform: translateZ(-160px) rotateX(87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotateX(90deg);
    transform: translateZ(-800px) rotateX(90deg);
    opacity: 0;
  }
}

/* slit-out-diagonal-1 */
.sltOutDgnlLft {
  -webkit-animation-name: sltOutDgnlLft;
  animation-name: sltOutDgnlLft;
}
@-webkit-keyframes sltOutDgnlLft {
  0% {
    -webkit-transform: translateZ(0) rotate3d(1, 1, 0, 0);
    transform: translateZ(0) rotate3d(1, 1, 0, 0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    opacity: 0;
  }
}
@keyframes sltOutDgnlLft {
  0% {
    -webkit-transform: translateZ(0) rotate3d(1, 1, 0, 0);
    transform: translateZ(0) rotate3d(1, 1, 0, 0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    transform: translateZ(-160px) rotate3d(1, 1, 0, 87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    transform: translateZ(-800px) rotate3d(1, 1, 0, 90deg);
    opacity: 0;
  }
}

/* slit-out-diagonal-2 */
.sltOutDgnlRgt {
  -webkit-animation-name: sltOutDgnlRgt;
  animation-name: sltOutDgnlRgt;
}
@-webkit-keyframes sltOutDgnlRgt {
  0% {
    -webkit-transform: translateZ(0) rotate3d(-1, 1, 0, 0);
    transform: translateZ(0) rotate3d(-1, 1, 0, 0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    opacity: 0;
  }
}
@keyframes sltOutDgnlRgt {
  0% {
    -webkit-transform: translateZ(0) rotate3d(-1, 1, 0, 0);
    transform: translateZ(0) rotate3d(-1, 1, 0, 0);
    opacity: 1;
  }
  54% {
    -webkit-transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    transform: translateZ(-160px) rotate3d(-1, 1, 0, -87deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    transform: translateZ(-800px) rotate3d(-1, 1, 0, -90deg);
    opacity: 0;
  }
}

/* slide-out-top */
.sldOutTp {
  -webkit-animation-name: sldOutTp;
  animation-name: sldOutTp;
}
@-webkit-keyframes sldOutTp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
}
@keyframes sldOutTp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px);
    transform: translateY(-1000px);
    opacity: 0;
  }
}

/* slide-out-tr */
.sldOutTr {
  -webkit-animation-name: sldOutTr;
  animation-name: sldOutTr;
}
@-webkit-keyframes sldOutTr {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px) translateX(1000px);
    transform: translateY(-1000px) translateX(1000px);
    opacity: 0;
  }
}
@keyframes sldOutTr {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px) translateX(1000px);
    transform: translateY(-1000px) translateX(1000px);
    opacity: 0;
  }
}

/* slide-out-right */
.sldOutRgt {
  -webkit-animation-name: sldOutRgt;
  animation-name: sldOutRgt;
}
@-webkit-keyframes sldOutRgt {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0;
  }
}
@keyframes sldOutRgt {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0;
  }
}

/* slide-out-br */
.sldOutBr {
  -webkit-animation-name: sldOutBr;
  animation-name: sldOutBr;
}
@-webkit-keyframes sldOutBr {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px) translateX(1000px);
    transform: translateY(1000px) translateX(1000px);
    opacity: 0;
  }
}
@keyframes sldOutBr {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px) translateX(1000px);
    transform: translateY(1000px) translateX(1000px);
    opacity: 0;
  }
}

/* slide-out-bottom */
.sldOutBtm {
  -webkit-animation-name: sldOutBtm;
  animation-name: sldOutBtm;
}
@-webkit-keyframes sldOutBtm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
}
@keyframes sldOutBtm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px);
    transform: translateY(1000px);
    opacity: 0;
  }
}

/* slide-out-bl */
.sldOutBl {
  -webkit-animation-name: sldOutBl;
  animation-name: sldOutBl;
}
@-webkit-keyframes sldOutBl {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px) translateX(-1000px);
    transform: translateY(1000px) translateX(-1000px);
    opacity: 0;
  }
}
@keyframes sldOutBl {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px) translateX(-1000px);
    transform: translateY(1000px) translateX(-1000px);
    opacity: 0;
  }
}

/* slide-out-left */
.sldOutLft {
  -webkit-animation-name: sldOutLft;
  animation-name: sldOutLft;
}
@-webkit-keyframes sldOutLft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0;
  }
}
@keyframes sldOutLft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0;
  }
}

/* slide-out-tl */
.sldOutTl {
  -webkit-animation-name: sldOutTl;
  animation-name: sldOutTl;
}
@-webkit-keyframes sldOutTl {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px) translateX(-1000px);
    transform: translateY(-1000px) translateX(-1000px);
    opacity: 0;
  }
}
@keyframes sldOutTl {
  0% {
    -webkit-transform: translateY(0) translateX(0);
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px) translateX(-1000px);
    transform: translateY(-1000px) translateX(-1000px);
    opacity: 0;
  }
}

/* slide-out-blurred-top */
.sldOutBlrTp {
  -webkit-animation-name: sldOutBlrTp;
  animation-name: sldOutBlrTp;
}
@-webkit-keyframes sldOutBlrTp {
  0% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px) scaleY(2) scaleX(0.2);
    transform: translateY(-1000px) scaleY(2) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrTp {
  0% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-1000px) scaleY(2) scaleX(0.2);
    transform: translateY(-1000px) scaleY(2) scaleX(0.2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-blurred-tr */
.sldOutBlrTr {
  -webkit-animation-name: sldOutBlrTr;
  animation-name: sldOutBlrTr;
}
@-webkit-keyframes sldOutBlrTr {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrTr {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    transform: translate(1000px, -1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-blurred-right */
.sldOutBlrRgt {
  -webkit-animation-name: sldOutBlrRgt;
  animation-name: sldOutBlrRgt;
}
@-webkit-keyframes sldOutBlrRgt {
  0% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) scaleX(2) scaleY(0.2);
    transform: translateX(1000px) scaleX(2) scaleY(0.2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrRgt {
  0% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) scaleX(2) scaleY(0.2);
    transform: translateX(1000px) scaleX(2) scaleY(0.2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-blurred-br */
.sldOutBlrBr {
  -webkit-animation-name: sldOutBlrBr;
  animation-name: sldOutBlrBr;
}
@-webkit-keyframes sldOutBlrBr {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(1000px, 1000px) skew(80deg, 10deg);
    transform: translate(1000px, 1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrBr {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(1000px, 1000px) skew(80deg, 10deg);
    transform: translate(1000px, 1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-blurred-bl */
.sldOutBlrBl {
  -webkit-animation-name: sldOutBlrBl;
  animation-name: sldOutBlrBl;
}
@-webkit-keyframes sldOutBlrBl {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrBl {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    transform: translate(-1000px, 1000px) skew(-80deg, -10deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-blurred-bottom */
.sldOutBlrBtm {
  -webkit-animation-name: sldOutBlrBtm;
  animation-name: sldOutBlrBtm;
}
@-webkit-keyframes sldOutBlrBtm {
  0% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px) scaleY(2) scaleX(0.2);
    transform: translateY(1000px) scaleY(2) scaleX(0.2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrBtm {
  0% {
    -webkit-transform: translateY(0) scaleY(1) scaleX(1);
    transform: translateY(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(1000px) scaleY(2) scaleX(0.2);
    transform: translateY(1000px) scaleY(2) scaleX(0.2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-blurred-left */
.sldOutBlrLft {
  -webkit-animation-name: sldOutBlrLft;
  animation-name: sldOutBlrLft;
}
@-webkit-keyframes sldOutBlrLft {
  0% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) scaleX(2) scaleY(0.2);
    transform: translateX(-1000px) scaleX(2) scaleY(0.2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrLft {
  0% {
    -webkit-transform: translateX(0) scaleY(1) scaleX(1);
    transform: translateX(0) scaleY(1) scaleX(1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) scaleX(2) scaleY(0.2);
    transform: translateX(-1000px) scaleX(2) scaleY(0.2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-blurred-tl */
.sldOutBlrTl {
  -webkit-animation-name: sldOutBlrTl;
  animation-name: sldOutBlrTl;
}
@-webkit-keyframes sldOutBlrTl {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}
@keyframes sldOutBlrTl {
  0% {
    -webkit-transform: translate(0, 0) skew(0deg, 0deg);
    transform: translate(0, 0) skew(0deg, 0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    transform: translate(-1000px, -1000px) skew(80deg, 10deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(40px);
    filter: blur(40px);
    opacity: 0;
  }
}

/* slide-out-elliptic-top-bck */
.sldOutElptTpB {
  -webkit-animation-name: sldOutElptTpB;
  animation-name: sldOutElptTpB;
}
@-webkit-keyframes sldOutElptTpB {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
    transform-origin: 50% 1400px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
    transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}
@keyframes sldOutElptTpB {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 1400px;
    transform-origin: 50% 1400px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
    transform: translateY(-600px) rotateX(-30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}

/* slide-out-elliptic-top-fwd */
.sldOutElptTpF {
  -webkit-animation-name: sldOutElptTpF;
  animation-name: sldOutElptTpF;
}
@-webkit-keyframes sldOutElptTpF {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -500px;
    transform-origin: 50% -500px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-600px) rotateX(20deg) scale(6);
    transform: translateY(-600px) rotateX(20deg) scale(6);
    -webkit-transform-origin: 50% 200%;
    transform-origin: 50% 200%;
    opacity: 0;
  }
}
@keyframes sldOutElptTpF {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -500px;
    transform-origin: 50% -500px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-600px) rotateX(20deg) scale(6);
    transform: translateY(-600px) rotateX(20deg) scale(6);
    -webkit-transform-origin: 50% 200%;
    transform-origin: 50% 200%;
    opacity: 0;
  }
}

/* slide-out-elliptic-right-bck */
.sldOutElptRgtB {
  -webkit-animation-name: sldOutElptRgtB;
  animation-name: sldOutElptRgtB;
}
@-webkit-keyframes sldOutElptRgtB {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -1800px 50%;
    transform-origin: -1800px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotateY(-30deg) scale(0);
    transform: translateX(1000px) rotateY(-30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 1;
  }
}
@keyframes sldOutElptRgtB {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -1800px 50%;
    transform-origin: -1800px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotateY(-30deg) scale(0);
    transform: translateX(1000px) rotateY(-30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 1;
  }
}

/* slide-out-elliptic-right-fwd */
.sldOutElptRgtF {
  -webkit-animation-name: sldOutElptRgtF;
  animation-name: sldOutElptRgtF;
}
@-webkit-keyframes sldOutElptRgtF {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 600px 50%;
    transform-origin: 600px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotateY(20deg) scale(6);
    transform: translateX(1000px) rotateY(20deg) scale(6);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
}
@keyframes sldOutElptRgtF {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 600px 50%;
    transform-origin: 600px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotateY(20deg) scale(6);
    transform: translateX(1000px) rotateY(20deg) scale(6);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 0;
  }
}

/* slide-out-elliptic-left-bck */
.sldOutElptLftB {
  -webkit-animation-name: sldOutElptLftB;
  animation-name: sldOutElptLftB;
}
@-webkit-keyframes sldOutElptLftB {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 2000px 50%;
    transform-origin: 2000px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotateY(30deg) scale(0);
    transform: translateX(-1000px) rotateY(30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 1;
  }
}
@keyframes sldOutElptLftB {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: 2000px 50%;
    transform-origin: 2000px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotateY(30deg) scale(0);
    transform: translateX(-1000px) rotateY(30deg) scale(0);
    -webkit-transform-origin: -100% 50%;
    transform-origin: -100% 50%;
    opacity: 1;
  }
}

/* slide-out-elliptic-left-fwd */
.sldOutElptLftF {
  -webkit-animation-name: sldOutElptLftF;
  animation-name: sldOutElptLftF;
}
@-webkit-keyframes sldOutElptLftF {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -500px 50%;
    transform-origin: -500px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotateY(-20deg) scale(6);
    transform: translateX(-1000px) rotateY(-20deg) scale(6);
    -webkit-transform-origin: 200% 50%;
    transform-origin: 200% 50%;
    opacity: 0;
  }
}
@keyframes sldOutElptLftF {
  0% {
    -webkit-transform: translateX(0) rotateY(0) scale(1);
    transform: translateX(0) rotateY(0) scale(1);
    -webkit-transform-origin: -500px 50%;
    transform-origin: -500px 50%;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotateY(-20deg) scale(6);
    transform: translateX(-1000px) rotateY(-20deg) scale(6);
    -webkit-transform-origin: 200% 50%;
    transform-origin: 200% 50%;
    opacity: 0;
  }
}

/* slide-out-elliptic-bottom-fwd */
.sldOutElptBtmF {
  -webkit-animation-name: sldOutElptBtmF;
  animation-name: sldOutElptBtmF;
}
@-webkit-keyframes sldOutElptBtmF {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 500px;
    transform-origin: 50% 500px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(600px) rotateX(-20deg) scale(6);
    transform: translateY(600px) rotateX(-20deg) scale(6);
    -webkit-transform-origin: 50% -100%;
    transform-origin: 50% -100%;
    opacity: 0;
  }
}
@keyframes sldOutElptBtmF {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% 500px;
    transform-origin: 50% 500px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(600px) rotateX(-20deg) scale(6);
    transform: translateY(600px) rotateX(-20deg) scale(6);
    -webkit-transform-origin: 50% -100%;
    transform-origin: 50% -100%;
    opacity: 0;
  }
}

/* slide-out-elliptic-bottom-bck */
.sldOutElptBtmB {
  -webkit-animation-name: sldOutElptBtmB;
  animation-name: sldOutElptBtmB;
}
@-webkit-keyframes sldOutElptBtmB {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -1400px;
    transform-origin: 50% -1400px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(600px) rotateX(30deg) scale(0);
    transform: translateY(600px) rotateX(30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}
@keyframes sldOutElptBtmB {
  0% {
    -webkit-transform: translateY(0) rotateX(0) scale(1);
    transform: translateY(0) rotateX(0) scale(1);
    -webkit-transform-origin: 50% -1400px;
    transform-origin: 50% -1400px;
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(600px) rotateX(30deg) scale(0);
    transform: translateY(600px) rotateX(30deg) scale(0);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    opacity: 1;
  }
}

/* bounce-out-top */
.boncOutTp {
  -webkit-animation-name: boncOutTp;
  animation-name: boncOutTp;
}
@-webkit-keyframes boncOutTp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  5% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  15% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(-38px);
    transform: translateY(-38px);
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  52% {
    -webkit-transform: translateY(-75px);
    transform: translateY(-75px);
  }
  70% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-800px);
    transform: translateY(-800px);
    opacity: 0;
  }
}
@keyframes boncOutTp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  5% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  15% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(-38px);
    transform: translateY(-38px);
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  52% {
    -webkit-transform: translateY(-75px);
    transform: translateY(-75px);
  }
  70% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-800px);
    transform: translateY(-800px);
    opacity: 0;
  }
}

/* bounce-out-right */
.boncOutRgt {
  -webkit-animation-name: boncOutRgt;
  animation-name: boncOutRgt;
}
@-webkit-keyframes boncOutRgt {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  5% {
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }
  15% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(38px);
    transform: translateX(38px);
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  52% {
    -webkit-transform: translateX(80px);
    transform: translateX(80px);
  }
  65% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0;
  }
}
@keyframes boncOutRgt {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  5% {
    -webkit-transform: translateX(30px);
    transform: translateX(30px);
  }
  15% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(38px);
    transform: translateX(38px);
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  52% {
    -webkit-transform: translateX(80px);
    transform: translateX(80px);
  }
  65% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px);
    transform: translateX(1000px);
    opacity: 0;
  }
}

/* bounce-out-bottom */
.boncOutBtm {
  -webkit-animation-name: boncOutBtm;
  animation-name: boncOutBtm;
}
@-webkit-keyframes boncOutBtm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  5% {
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }
  15% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(38px);
    transform: translateY(38px);
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  52% {
    -webkit-transform: translateY(75px);
    transform: translateY(75px);
  }
  70% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(800px);
    transform: translateY(800px);
    opacity: 0;
  }
}
@keyframes boncOutBtm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  5% {
    -webkit-transform: translateY(30px);
    transform: translateY(30px);
  }
  15% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  25% {
    -webkit-transform: translateY(38px);
    transform: translateY(38px);
  }
  38% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  52% {
    -webkit-transform: translateY(75px);
    transform: translateY(75px);
  }
  70% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(800px);
    transform: translateY(800px);
    opacity: 0;
  }
}

/* bounce-out-left */
.boncOutLft {
  -webkit-animation-name: boncOutLft;
  animation-name: boncOutLft;
}
@-webkit-keyframes boncOutLft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  5% {
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }
  15% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(-38px);
    transform: translateX(-38px);
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  52% {
    -webkit-transform: translateX(-80px);
    transform: translateX(-80px);
  }
  70% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0;
  }
}
@keyframes boncOutLft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  5% {
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
  }
  15% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(-38px);
    transform: translateX(-38px);
  }
  38% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  52% {
    -webkit-transform: translateX(-80px);
    transform: translateX(-80px);
  }
  70% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px);
    transform: translateX(-1000px);
    opacity: 0;
  }
}

/* bounce-out-bck */
.boncOutBck {
  -webkit-animation-name: boncOutBck;
  animation-name: boncOutBck;
}
@-webkit-keyframes boncOutBck {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  5% {
    -webkit-transform: translateZ(-100px);
    transform: translateZ(-100px);
  }
  15% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  25% {
    -webkit-transform: translateZ(-110px);
    transform: translateZ(-110px);
  }
  38% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  52% {
    -webkit-transform: translateZ(-200px);
    transform: translateZ(-200px);
  }
  70% {
    -webkit-transform: translateZ(0) scale(1);
    transform: translateZ(0) scale(1);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-900px) scale(0);
    transform: translateZ(-900px) scale(0);
    opacity: 0;
  }
}
@keyframes boncOutBck {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  5% {
    -webkit-transform: translateZ(-100px);
    transform: translateZ(-100px);
  }
  15% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  25% {
    -webkit-transform: translateZ(-110px);
    transform: translateZ(-110px);
  }
  38% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  52% {
    -webkit-transform: translateZ(-200px);
    transform: translateZ(-200px);
  }
  70% {
    -webkit-transform: translateZ(0) scale(1);
    transform: translateZ(0) scale(1);
  }
  85% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translateZ(-900px) scale(0);
    transform: translateZ(-900px) scale(0);
    opacity: 0;
  }
}

/* roll-out-left */
.rolOutLft {
  -webkit-animation-name: rolOutLft;
  animation-name: rolOutLft;
}
@-webkit-keyframes rolOutLft {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotate(-540deg);
    transform: translateX(-1000px) rotate(-540deg);
    opacity: 0;
  }
}
@keyframes rolOutLft {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotate(-540deg);
    transform: translateX(-1000px) rotate(-540deg);
    opacity: 0;
  }
}

/* roll-out-top */
.rolOutTp {
  -webkit-animation-name: rolOutTp;
  animation-name: rolOutTp;
}
@-webkit-keyframes rolOutTp {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-800px) rotate(-540deg);
    transform: translateY(-800px) rotate(-540deg);
    opacity: 0;
  }
}
@keyframes rolOutTp {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-800px) rotate(-540deg);
    transform: translateY(-800px) rotate(-540deg);
    opacity: 0;
  }
}

/* roll-out-right */
.rolOutRgt {
  -webkit-animation-name: rolOutRgt;
  animation-name: rolOutRgt;
}
@-webkit-keyframes rolOutRgt {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotate(540deg);
    transform: translateX(1000px) rotate(540deg);
    opacity: 0;
  }
}
@keyframes rolOutRgt {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotate(540deg);
    transform: translateX(1000px) rotate(540deg);
    opacity: 0;
  }
}

/* roll-out-bottom */
.rolOutBtm {
  -webkit-animation-name: rolOutBtm;
  animation-name: rolOutBtm;
}
@-webkit-keyframes rolOutBtm {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(800px) rotate(540deg);
    transform: translateY(800px) rotate(540deg);
    opacity: 0;
  }
}
@keyframes rolOutBtm {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(800px) rotate(540deg);
    transform: translateY(800px) rotate(540deg);
    opacity: 0;
  }
}

/* roll-out-blurred-left */
.rolOutBlrLft {
  -webkit-animation-name: rolOutBlrLft;
  animation-name: rolOutBlrLft;
}
@-webkit-keyframes rolOutBlrLft {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotate(-720deg);
    transform: translateX(-1000px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}
@keyframes rolOutBlrLft {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-1000px) rotate(-720deg);
    transform: translateX(-1000px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}

/* roll-out-blurred-top */
.rolOutBlrTp {
  -webkit-animation-name: rolOutBlrTp;
  animation-name: rolOutBlrTp;
}
@-webkit-keyframes rolOutBlrTp {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-800px) rotate(-720deg);
    transform: translateY(-800px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}
@keyframes rolOutBlrTp {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-800px) rotate(-720deg);
    transform: translateY(-800px) rotate(-720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}

/* roll-out-blurred-right */
.rolOutBlrRgt {
  -webkit-animation-name: rolOutBlrRgt;
  animation-name: rolOutBlrRgt;
}
@-webkit-keyframes rolOutBlrRgt {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotate(720deg);
    transform: translateX(1000px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}
@keyframes rolOutBlrRgt {
  0% {
    -webkit-transform: translateX(0) rotate(0deg);
    transform: translateX(0) rotate(0deg);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(1000px) rotate(720deg);
    transform: translateX(1000px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}

/* roll-out-blurred-bottom */
.rolOutBlrBtm {
  -webkit-animation-name: rolOutBlrBtm;
  animation-name: rolOutBlrBtm;
}
@-webkit-keyframes rolOutBlrBtm {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(800px) rotate(720deg);
    transform: translateY(800px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}
@keyframes rolOutBlrBtm {
  0% {
    -webkit-transform: translateY(0) rotate(0deg);
    transform: translateY(0) rotate(0deg);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(800px) rotate(720deg);
    transform: translateY(800px) rotate(720deg);
    -webkit-filter: blur(50px);
    filter: blur(50px);
    opacity: 0;
  }
}

/* fade-out */
.fdOut {
  -webkit-animation-name: fdOut;
  animation-name: fdOut;
}
@-webkit-keyframes fdOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes fdOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* fade-out-top */
.fdOutTp {
  -webkit-animation-name: fdOutTp;
  animation-name: fdOutTp;
}
@-webkit-keyframes fdOutTp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    opacity: 0;
  }
}
@keyframes fdOutTp {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
    opacity: 0;
  }
}

/* fade-out-tr */
.fdOutTr {
  -webkit-animation-name: fdOutTr;
  animation-name: fdOutTr;
}
@-webkit-keyframes fdOutTr {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50px) translateY(-50px);
    transform: translateX(50px) translateY(-50px);
    opacity: 0;
  }
}
@keyframes fdOutTr {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50px) translateY(-50px);
    transform: translateX(50px) translateY(-50px);
    opacity: 0;
  }
}

/* fade-out-right */
.fdOutRgt {
  -webkit-animation-name: fdOutRgt;
  animation-name: fdOutRgt;
}
@-webkit-keyframes fdOutRgt {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0;
  }
}
@keyframes fdOutRgt {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50px);
    transform: translateX(50px);
    opacity: 0;
  }
}

/* fade-out-br */
.fdOutBr {
  -webkit-animation-name: fdOutBr;
  animation-name: fdOutBr;
}
@-webkit-keyframes fdOutBr {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50px) translateY(50px);
    transform: translateX(50px) translateY(50px);
    opacity: 0;
  }
}
@keyframes fdOutBr {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(50px) translateY(50px);
    transform: translateX(50px) translateY(50px);
    opacity: 0;
  }
}

/* fade-out-bottom */
.fdOutBtm {
  -webkit-animation-name: fdOutBtm;
  animation-name: fdOutBtm;
}
@-webkit-keyframes fdOutBtm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
  }
}
@keyframes fdOutBtm {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
  }
}

/* fade-out-bl */
.fdOutBl {
  -webkit-animation-name: fdOutBl;
  animation-name: fdOutBl;
}
@-webkit-keyframes fdOutBl {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-50px) translateY(50px);
    transform: translateX(-50px) translateY(50px);
    opacity: 0;
  }
}
@keyframes fdOutBl {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-50px) translateY(50px);
    transform: translateX(-50px) translateY(50px);
    opacity: 0;
  }
}

/* fade-out-left */
.fdOutLft {
  -webkit-animation-name: fdOutLft;
  animation-name: fdOutLft;
}
@-webkit-keyframes fdOutLft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity: 0;
  }
}
@keyframes fdOutLft {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-50px);
    transform: translateX(-50px);
    opacity: 0;
  }
}

/* fade-out-tl */
.fdOutTl {
  -webkit-animation-name: fdOutTl;
  animation-name: fdOutTl;
}
@-webkit-keyframes fdOutTl {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-50px) translateY(-50px);
    transform: translateX(-50px) translateY(-50px);
    opacity: 0;
  }
}
@keyframes fdOutTl {
  0% {
    -webkit-transform: translateX(0) translateY(0);
    transform: translateX(0) translateY(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateX(-50px) translateY(-50px);
    transform: translateX(-50px) translateY(-50px);
    opacity: 0;
  }
}

/* puff-out-center */
.pufOutCntr {
  -webkit-animation-name: pufOutCntr;
  animation-name: pufOutCntr;
}
@-webkit-keyframes pufOutCntr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutCntr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-top */
.pufOutTp {
  -webkit-animation-name: pufOutTp;
  animation-name: pufOutTp;
}
@-webkit-keyframes pufOutTp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutTp {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 0%;
    transform-origin: 50% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-tr */
.pufOutTr {
  -webkit-animation-name: pufOutTr;
  animation-name: pufOutTr;
}
@-webkit-keyframes pufOutTr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutTr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-right */
.pufOutRgt {
  -webkit-animation-name: pufOutRgt;
  animation-name: pufOutRgt;
}
@-webkit-keyframes pufOutRgt {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutRgt {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-br */
.pufOutBr {
  -webkit-animation-name: pufOutBr;
  animation-name: pufOutBr;
}
@-webkit-keyframes pufOutBr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutBr {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-bottom */
.pufOutBtm {
  -webkit-animation-name: pufOutBtm;
  animation-name: pufOutBtm;
}
@-webkit-keyframes pufOutBtm {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutBtm {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-bl */
.pufOutBl {
  -webkit-animation-name: pufOutBl;
  animation-name: pufOutBl;
}
@-webkit-keyframes pufOutBl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutBl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-left */
.pufOutLft {
  -webkit-animation-name: pufOutLft;
  animation-name: pufOutLft;
}
@-webkit-keyframes pufOutLft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutLft {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 50%;
    transform-origin: 0% 50%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-tl */
.pufOutTl {
  -webkit-animation-name: pufOutTl;
  animation-name: pufOutTl;
}
@-webkit-keyframes pufOutTl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutTl {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(2);
    transform: scale(2);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-hor */
.pufOutX {
  -webkit-animation-name: pufOutX;
  animation-name: pufOutX;
}
@-webkit-keyframes pufOutX {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(2);
    transform: scaleX(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutX {
  0% {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleX(2);
    transform: scaleX(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* puff-out-ver */
.pufOutY {
  -webkit-animation-name: pufOutY;
  animation-name: pufOutY;
}
@-webkit-keyframes pufOutY {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(2);
    transform: scaleY(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}
@keyframes pufOutY {
  0% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
  100% {
    -webkit-transform: scaleY(2);
    transform: scaleY(2);
    -webkit-filter: blur(4px);
    filter: blur(4px);
    opacity: 0;
  }
}

/* tracking-in-expand */
.trkInXpnd {
  -webkit-animation-name: trkInXpnd;
  animation-name: trkInXpnd;
}
@-webkit-keyframes trkInXpnd {
  0% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}
@keyframes trkInXpnd {
  0% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}

/* tracking-in-contract */
.trkInCntrct {
  -webkit-animation-name: trkInCntrct;
  animation-name: trkInCntrct;
}
@-webkit-keyframes trkInCntrct {
  0% {
    letter-spacing: 1em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: normal;
    opacity: 1;
  }
}
@keyframes trkInCntrct {
  0% {
    letter-spacing: 1em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: normal;
    opacity: 1;
  }
}

/* tracking-out-contract */
.trkOutCntrct {
  -webkit-animation-name: trkOutCntrct;
  animation-name: trkOutCntrct;
}
@-webkit-keyframes trkOutCntrct {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
}
@keyframes trkOutCntrct {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 1;
  }
  100% {
    letter-spacing: -0.5em;
    opacity: 0;
  }
}

/* tracking-out-expand */
.trkOutXpnd {
  -webkit-animation-name: trkOutXpnd;
  animation-name: trkOutXpnd;
}
@-webkit-keyframes trkOutXpnd {
  0% {
    opacity: 1;
  }
  60% {
    opacity: 0.8;
  }
  100% {
    letter-spacing: 1em;
    opacity: 0;
  }
}
@keyframes trkOutXpnd {
  0% {
    opacity: 1;
  }
  60% {
    opacity: 0.8;
  }
  100% {
    letter-spacing: 1em;
    opacity: 0;
  }
}

/* text-focus-in */
.txtFxIn {
  -webkit-animation-name: txtFxIn;
  animation-name: txtFxIn;
}
@-webkit-keyframes txtFxIn {
  0% {
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes txtFxIn {
  0% {
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* focus-in-expand */
.fxInXpnd {
  -webkit-animation-name: fxInXpnd;
  animation-name: fxInXpnd;
}
@-webkit-keyframes fxInXpnd {
  0% {
    letter-spacing: -0.5em;
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes fxInXpnd {
  0% {
    letter-spacing: -0.5em;
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* focus-in-expand-fwd */
.fxInXpndF {
  -webkit-animation-name: fxInXpndF;
  animation-name: fxInXpndF;
}
@-webkit-keyframes fxInXpndF {
  0% {
    letter-spacing: -0.5em;
    -webkit-transform: translateZ(-800px);
    transform: translateZ(-800px);
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes fxInXpndF {
  0% {
    letter-spacing: -0.5em;
    -webkit-transform: translateZ(-800px);
    transform: translateZ(-800px);
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* focus-in-contract */
.fxInCntrct {
  -webkit-animation-name: fxInCntrct;
  animation-name: fxInCntrct;
}
@-webkit-keyframes fxInCntrct {
  0% {
    letter-spacing: 1em;
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes fxInCntrct {
  0% {
    letter-spacing: 1em;
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}

/* focus-in-contract-bck */
.fxInCntrctB {
  -webkit-animation-name: fxInCntrctB;
  animation-name: fxInCntrctB;
}
@-webkit-keyframes fxInCntrctB {
  0% {
    letter-spacing: 1em;
    -webkit-transform: translateZ(300px);
    transform: translateZ(300px);
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(12px);
    transform: translateZ(12px);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}
@keyframes fxInCntrctB {
  0% {
    letter-spacing: 1em;
    -webkit-transform: translateZ(300px);
    transform: translateZ(300px);
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateZ(12px);
    transform: translateZ(12px);
    -webkit-filter: blur(0);
    filter: blur(0);
    opacity: 1;
  }
}

/* text-blur-out */
.txtBlrOut {
  -webkit-animation-name: txtBlrOut;
  animation-name: txtBlrOut;
}
@-webkit-keyframes txtBlrOut {
  0% {
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}
@keyframes txtBlrOut {
  0% {
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}

/* blur-out-contract */
.blrOutCntrct {
  -webkit-animation-name: blrOutCntrct;
  animation-name: blrOutCntrct;
}
@-webkit-keyframes blrOutCntrct {
  0% {
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: -0.5em;
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}
@keyframes blrOutCntrct {
  0% {
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: -0.5em;
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}

/* blur-out-contract-bck */
.blrOutCntrctB {
  -webkit-animation-name: blrOutCntrctB;
  animation-name: blrOutCntrctB;
}
@-webkit-keyframes blrOutCntrctB {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: -0.5em;
    -webkit-transform: translateZ(-500px);
    transform: translateZ(-500px);
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}
@keyframes blrOutCntrctB {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: -0.5em;
    -webkit-transform: translateZ(-500px);
    transform: translateZ(-500px);
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}

/* blur-out-expand */
.blrOutXpnd {
  -webkit-animation-name: blrOutXpnd;
  animation-name: blrOutXpnd;
}
@-webkit-keyframes blrOutXpnd {
  0% {
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: 1em;
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}
@keyframes blrOutXpnd {
  0% {
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: 1em;
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}

/* blur-out-expand-fwd */
.blrOutXpndF {
  -webkit-animation-name: blrOutXpndF;
  animation-name: blrOutXpndF;
}
@-webkit-keyframes blrOutXpndF {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: 1em;
    -webkit-transform: translateZ(300px);
    transform: translateZ(300px);
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}
@keyframes blrOutXpndF {
  0% {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-filter: blur(0.01);
    filter: blur(0.01);
  }
  100% {
    letter-spacing: 1em;
    -webkit-transform: translateZ(300px);
    transform: translateZ(300px);
    -webkit-filter: blur(12px) opacity(0%);
    filter: blur(12px) opacity(0%);
  }
}

/* vibrate-1 */
.vbrtSlo {
  -webkit-animation-name: vbrtSlo;
  animation-name: vbrtSlo;
}
@-webkit-keyframes vbrtSlo {
  0% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  20% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, 2px);
    transform: translate(2px, 2px);
  }
  80% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes vbrtSlo {
  0% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  20% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, 2px);
    transform: translate(2px, 2px);
  }
  80% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}

/* vibrate-3 */
.vbrtFst {
  -webkit-animation-name: vbrtFst;
  animation-name: vbrtFst;
}
@-webkit-keyframes vbrtFst {
  0% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  10% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  20% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  30% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(2px, 2px);
    transform: translate(2px, 2px);
  }
  50% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  70% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  80% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  90% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}
@keyframes vbrtFst {
  0% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
  10% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  20% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  30% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  40% {
    -webkit-transform: translate(2px, 2px);
    transform: translate(2px, 2px);
  }
  50% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  60% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  70% {
    -webkit-transform: translate(-2px, 2px);
    transform: translate(-2px, 2px);
  }
  80% {
    -webkit-transform: translate(-2px, -2px);
    transform: translate(-2px, -2px);
  }
  90% {
    -webkit-transform: translate(2px, -2px);
    transform: translate(2px, -2px);
  }
  100% {
    -webkit-transform: translate(0);
    transform: translate(0);
  }
}

/* shake-horizontal */
.shkX {
  -webkit-animation-name: shkX;
  animation-name: shkX;
}
@-webkit-keyframes shkX {
  0%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
  80% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  90% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
}
@keyframes shkX {
  0%,
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
  }
  80% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  90% {
    -webkit-transform: translateX(-8px);
    transform: translateX(-8px);
  }
}

/* shake-vertical */
.shkY {
  -webkit-animation-name: shkY;
  animation-name: shkY;
}
@-webkit-keyframes shkY {
  0%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  80% {
    -webkit-transform: translateY(6.4px);
    transform: translateY(6.4px);
  }
  90% {
    -webkit-transform: translateY(-6.4px);
    transform: translateY(-6.4px);
  }
}
@keyframes shkY {
  0%,
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  10%,
  30%,
  50%,
  70% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  20%,
  40%,
  60% {
    -webkit-transform: translateY(8px);
    transform: translateY(8px);
  }
  80% {
    -webkit-transform: translateY(6.4px);
    transform: translateY(6.4px);
  }
  90% {
    -webkit-transform: translateY(-6.4px);
    transform: translateY(-6.4px);
  }
}

/* shake-lr */
.shkLr {
  -webkit-animation-name: shkLr;
  animation-name: shkLr;
}
@-webkit-keyframes shkLr {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  10% {
    -webkit-transform: rotate(8deg);
    transform: rotate(8deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  80% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  90% {
    -webkit-transform: rotate(8deg);
    transform: rotate(8deg);
  }
}
@keyframes shkLr {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  10% {
    -webkit-transform: rotate(8deg);
    transform: rotate(8deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(10deg);
    transform: rotate(10deg);
  }
  80% {
    -webkit-transform: rotate(-8deg);
    transform: rotate(-8deg);
  }
  90% {
    -webkit-transform: rotate(8deg);
    transform: rotate(8deg);
  }
}

/* shake-top */
.shkTp {
  -webkit-animation-name: shkTp;
  animation-name: shkTp;
}
@-webkit-keyframes shkTp {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkTp {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* shake-tr */
.shkTr {
  -webkit-animation-name: shkTr;
  animation-name: shkTr;
}
@-webkit-keyframes shkTr {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkTr {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 0;
    transform-origin: 100% 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* shake-right */
.shkRgt {
  -webkit-animation-name: shkRgt;
  animation-name: shkRgt;
}
@-webkit-keyframes shkRgt {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkRgt {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* shake-br */
.shkBr {
  -webkit-animation-name: shkBr;
  animation-name: shkBr;
}
@-webkit-keyframes shkBr {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkBr {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* shake-bottom */
.shkBtm {
  -webkit-animation-name: shkBtm;
  animation-name: shkBtm;
}
@-webkit-keyframes shkBtm {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkBtm {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* shake-bl */
.shkBl {
  -webkit-animation-name: shkBl;
  animation-name: shkBl;
}
@-webkit-keyframes shkBl {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkBl {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* shake-left */
.shkLft {
  -webkit-animation-name: shkLft;
  animation-name: shkLft;
}
@-webkit-keyframes shkLft {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkLft {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* shake-tl */
.shkTl {
  -webkit-animation-name: shkTl;
  animation-name: shkTl;
}
@-webkit-keyframes shkTl {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@keyframes shkTl {
  0%,
  100% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
  }
  10% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
  20%,
  40%,
  60% {
    -webkit-transform: rotate(-4deg);
    transform: rotate(-4deg);
  }
  30%,
  50%,
  70% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }
  80% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }
  90% {
    -webkit-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}

/* jello-horizontal */
.jloX {
  -webkit-animation-name: jloX;
  animation-name: jloX;
}
@-webkit-keyframes jloX {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes jloX {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

/* jello-vertical */
.jloY {
  -webkit-animation-name: jloY;
  animation-name: jloY;
}
@-webkit-keyframes jloY {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  40% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  50% {
    -webkit-transform: scale3d(0.85, 1.15, 1);
    transform: scale3d(0.85, 1.15, 1);
  }
  65% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  75% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes jloY {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  40% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  50% {
    -webkit-transform: scale3d(0.85, 1.15, 1);
    transform: scale3d(0.85, 1.15, 1);
  }
  65% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  75% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

/* jello-diagonal-1 */
.jloDgnlLft {
  -webkit-animation-name: jloDgnlLft;
  animation-name: jloDgnlLft;
}
@-webkit-keyframes jloDgnlLft {
  0% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
  30% {
    -webkit-transform: skew(25deg 25deg);
    transform: skew(25deg 25deg);
  }
  40% {
    -webkit-transform: skew(-15deg, -15deg);
    transform: skew(-15deg, -15deg);
  }
  50% {
    -webkit-transform: skew(15deg, 15deg);
    transform: skew(15deg, 15deg);
  }
  65% {
    -webkit-transform: skew(-5deg, -5deg);
    transform: skew(-5deg, -5deg);
  }
  75% {
    -webkit-transform: skew(5deg, 5deg);
    transform: skew(5deg, 5deg);
  }
  100% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
}
@keyframes jloDgnlLft {
  0% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
  30% {
    -webkit-transform: skew(25deg 25deg);
    transform: skew(25deg 25deg);
  }
  40% {
    -webkit-transform: skew(-15deg, -15deg);
    transform: skew(-15deg, -15deg);
  }
  50% {
    -webkit-transform: skew(15deg, 15deg);
    transform: skew(15deg, 15deg);
  }
  65% {
    -webkit-transform: skew(-5deg, -5deg);
    transform: skew(-5deg, -5deg);
  }
  75% {
    -webkit-transform: skew(5deg, 5deg);
    transform: skew(5deg, 5deg);
  }
  100% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
}

/* jello-diagonal-2 */
.jloDgnlRgt {
  -webkit-animation-name: jloDgnlRgt;
  animation-name: jloDgnlRgt;
}
@-webkit-keyframes jloDgnlRgt {
  0% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
  30% {
    -webkit-transform: skew(-25deg -25deg);
    transform: skew(-25deg -25deg);
  }
  40% {
    -webkit-transform: skew(15deg, 15deg);
    transform: skew(15deg, 15deg);
  }
  50% {
    -webkit-transform: skew(-15deg, -15deg);
    transform: skew(-15deg, -15deg);
  }
  65% {
    -webkit-transform: skew(5deg, 5deg);
    transform: skew(5deg, 5deg);
  }
  75% {
    -webkit-transform: skew(-5deg, -5deg);
    transform: skew(-5deg, -5deg);
  }
  100% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
}
@keyframes jloDgnlRgt {
  0% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
  30% {
    -webkit-transform: skew(-25deg -25deg);
    transform: skew(-25deg -25deg);
  }
  40% {
    -webkit-transform: skew(15deg, 15deg);
    transform: skew(15deg, 15deg);
  }
  50% {
    -webkit-transform: skew(-15deg, -15deg);
    transform: skew(-15deg, -15deg);
  }
  65% {
    -webkit-transform: skew(5deg, 5deg);
    transform: skew(5deg, 5deg);
  }
  75% {
    -webkit-transform: skew(-5deg, -5deg);
    transform: skew(-5deg, -5deg);
  }
  100% {
    -webkit-transform: skew(0deg 0deg);
    transform: skew(0deg 0deg);
  }
}

/* wobble-hor-bottom */
.wblXBtm {
  -webkit-animation-name: wblXBtm;
  animation-name: wblXBtm;
}
@-webkit-keyframes wblXBtm {
  0%,
  100% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-30px) rotate(-6deg);
    transform: translateX(-30px) rotate(-6deg);
  }
  30% {
    -webkit-transform: translateX(15px) rotate(6deg);
    transform: translateX(15px) rotate(6deg);
  }
  45% {
    -webkit-transform: translateX(-15px) rotate(-3.6deg);
    transform: translateX(-15px) rotate(-3.6deg);
  }
  60% {
    -webkit-transform: translateX(9px) rotate(2.4deg);
    transform: translateX(9px) rotate(2.4deg);
  }
  75% {
    -webkit-transform: translateX(-6px) rotate(-1.2deg);
    transform: translateX(-6px) rotate(-1.2deg);
  }
}
@keyframes wblXBtm {
  0%,
  100% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-30px) rotate(-6deg);
    transform: translateX(-30px) rotate(-6deg);
  }
  30% {
    -webkit-transform: translateX(15px) rotate(6deg);
    transform: translateX(15px) rotate(6deg);
  }
  45% {
    -webkit-transform: translateX(-15px) rotate(-3.6deg);
    transform: translateX(-15px) rotate(-3.6deg);
  }
  60% {
    -webkit-transform: translateX(9px) rotate(2.4deg);
    transform: translateX(9px) rotate(2.4deg);
  }
  75% {
    -webkit-transform: translateX(-6px) rotate(-1.2deg);
    transform: translateX(-6px) rotate(-1.2deg);
  }
}

/* wobble-hor-top */
.wblXTp {
  -webkit-animation-name: wblXTp;
  animation-name: wblXTp;
}
@-webkit-keyframes wblXTp {
  0%,
  100% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-30px) rotate(6deg);
    transform: translateX(-30px) rotate(6deg);
  }
  30% {
    -webkit-transform: translateX(15px) rotate(-6deg);
    transform: translateX(15px) rotate(-6deg);
  }
  45% {
    -webkit-transform: translateX(-15px) rotate(3.6deg);
    transform: translateX(-15px) rotate(3.6deg);
  }
  60% {
    -webkit-transform: translateX(9px) rotate(-2.4deg);
    transform: translateX(9px) rotate(-2.4deg);
  }
  75% {
    -webkit-transform: translateX(-6px) rotate(1.2deg);
    transform: translateX(-6px) rotate(1.2deg);
  }
}
@keyframes wblXTp {
  0%,
  100% {
    -webkit-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-30px) rotate(6deg);
    transform: translateX(-30px) rotate(6deg);
  }
  30% {
    -webkit-transform: translateX(15px) rotate(-6deg);
    transform: translateX(15px) rotate(-6deg);
  }
  45% {
    -webkit-transform: translateX(-15px) rotate(3.6deg);
    transform: translateX(-15px) rotate(3.6deg);
  }
  60% {
    -webkit-transform: translateX(9px) rotate(-2.4deg);
    transform: translateX(9px) rotate(-2.4deg);
  }
  75% {
    -webkit-transform: translateX(-6px) rotate(1.2deg);
    transform: translateX(-6px) rotate(1.2deg);
  }
}

/* wobble-ver-left */
.wblYLft {
  -webkit-animation-name: wblYLft;
  animation-name: wblYLft;
}
@-webkit-keyframes wblYLft {
  0%,
  100% {
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateY(-30px) rotate(-6deg);
    transform: translateY(-30px) rotate(-6deg);
  }
  30% {
    -webkit-transform: translateY(15px) rotate(6deg);
    transform: translateY(15px) rotate(6deg);
  }
  45% {
    -webkit-transform: translateY(-15px) rotate(-3.6deg);
    transform: translateY(-15px) rotate(-3.6deg);
  }
  60% {
    -webkit-transform: translateY(9px) rotate(2.4deg);
    transform: translateY(9px) rotate(2.4deg);
  }
  75% {
    -webkit-transform: translateY(-6px) rotate(-1.2deg);
    transform: translateY(-6px) rotate(-1.2deg);
  }
}
@keyframes wblYLft {
  0%,
  100% {
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateY(-30px) rotate(-6deg);
    transform: translateY(-30px) rotate(-6deg);
  }
  30% {
    -webkit-transform: translateY(15px) rotate(6deg);
    transform: translateY(15px) rotate(6deg);
  }
  45% {
    -webkit-transform: translateY(-15px) rotate(-3.6deg);
    transform: translateY(-15px) rotate(-3.6deg);
  }
  60% {
    -webkit-transform: translateY(9px) rotate(2.4deg);
    transform: translateY(9px) rotate(2.4deg);
  }
  75% {
    -webkit-transform: translateY(-6px) rotate(-1.2deg);
    transform: translateY(-6px) rotate(-1.2deg);
  }
}

/* wobble-ver-right */
.wblYRgt {
  -webkit-animation-name: wblYRgt;
  animation-name: wblYRgt;
}
@-webkit-keyframes wblYRgt {
  0%,
  100% {
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateY(-30px) rotate(6deg);
    transform: translateY(-30px) rotate(6deg);
  }
  30% {
    -webkit-transform: translateY(15px) rotate(-6deg);
    transform: translateY(15px) rotate(-6deg);
  }
  45% {
    -webkit-transform: translateY(-15px) rotate(3.6deg);
    transform: translateY(-15px) rotate(3.6deg);
  }
  60% {
    -webkit-transform: translateY(9px) rotate(-2.4deg);
    transform: translateY(9px) rotate(-2.4deg);
  }
  75% {
    -webkit-transform: translateY(-6px) rotate(1.2deg);
    transform: translateY(-6px) rotate(1.2deg);
  }
}
@keyframes wblYRgt {
  0%,
  100% {
    -webkit-transform: translateY(0) rotate(0);
    transform: translateY(0) rotate(0);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateY(-30px) rotate(6deg);
    transform: translateY(-30px) rotate(6deg);
  }
  30% {
    -webkit-transform: translateY(15px) rotate(-6deg);
    transform: translateY(15px) rotate(-6deg);
  }
  45% {
    -webkit-transform: translateY(-15px) rotate(3.6deg);
    transform: translateY(-15px) rotate(3.6deg);
  }
  60% {
    -webkit-transform: translateY(9px) rotate(-2.4deg);
    transform: translateY(9px) rotate(-2.4deg);
  }
  75% {
    -webkit-transform: translateY(-6px) rotate(1.2deg);
    transform: translateY(-6px) rotate(1.2deg);
  }
}

/* bounce-top */
.boncTp {
  -webkit-animation-name: boncTp;
  animation-name: boncTp;
}
@-webkit-keyframes boncTp {
  0% {
    -webkit-transform: translateY(-45px);
    transform: translateY(-45px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(-24px);
    transform: translateY(-24px);
  }
  65% {
    -webkit-transform: translateY(-12px);
    transform: translateY(-12px);
  }
  82% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
  93% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  25%,
  55%,
  75%,
  87% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
}
@keyframes boncTp {
  0% {
    -webkit-transform: translateY(-45px);
    transform: translateY(-45px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(-24px);
    transform: translateY(-24px);
  }
  65% {
    -webkit-transform: translateY(-12px);
    transform: translateY(-12px);
  }
  82% {
    -webkit-transform: translateY(-6px);
    transform: translateY(-6px);
  }
  93% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  25%,
  55%,
  75%,
  87% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
}

/* bounce-bottom */
.boncBtm {
  -webkit-animation-name: boncBtm;
  animation-name: boncBtm;
}
@-webkit-keyframes boncBtm {
  0% {
    -webkit-transform: translateY(45px);
    transform: translateY(45px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(24px);
    transform: translateY(24px);
  }
  65% {
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
  }
  82% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
  93% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  25%,
  55%,
  75%,
  87% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
}
@keyframes boncBtm {
  0% {
    -webkit-transform: translateY(45px);
    transform: translateY(45px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateY(24px);
    transform: translateY(24px);
  }
  65% {
    -webkit-transform: translateY(12px);
    transform: translateY(12px);
  }
  82% {
    -webkit-transform: translateY(6px);
    transform: translateY(6px);
  }
  93% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  25%,
  55%,
  75%,
  87% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
    opacity: 1;
  }
}

/* bounce-left */
.boncLft {
  -webkit-animation-name: boncLft;
  animation-name: boncLft;
}
@-webkit-keyframes boncLft {
  0% {
    -webkit-transform: translateX(-48px);
    transform: translateX(-48px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateX(-26px);
    transform: translateX(-26px);
  }
  65% {
    -webkit-transform: translateX(-13px);
    transform: translateX(-13px);
  }
  82% {
    -webkit-transform: translateX(-6.5px);
    transform: translateX(-6.5px);
  }
  93% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
  25%,
  55%,
  75%,
  87%,
  98% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
  }
}
@keyframes boncLft {
  0% {
    -webkit-transform: translateX(-48px);
    transform: translateX(-48px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateX(-26px);
    transform: translateX(-26px);
  }
  65% {
    -webkit-transform: translateX(-13px);
    transform: translateX(-13px);
  }
  82% {
    -webkit-transform: translateX(-6.5px);
    transform: translateX(-6.5px);
  }
  93% {
    -webkit-transform: translateX(-4px);
    transform: translateX(-4px);
  }
  25%,
  55%,
  75%,
  87%,
  98% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
  }
}

/* bounce-right */
.boncRgt {
  -webkit-animation-name: boncRgt;
  animation-name: boncRgt;
}
@-webkit-keyframes boncRgt {
  0% {
    -webkit-transform: translateX(48px);
    transform: translateX(48px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateX(26px);
    transform: translateX(26px);
  }
  65% {
    -webkit-transform: translateX(13px);
    transform: translateX(13px);
  }
  82% {
    -webkit-transform: translateX(6.5px);
    transform: translateX(6.5px);
  }
  93% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  25%,
  55%,
  75%,
  87%,
  98% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
  }
}
@keyframes boncRgt {
  0% {
    -webkit-transform: translateX(48px);
    transform: translateX(48px);
    opacity: 1;
  }
  24% {
    opacity: 1;
  }
  40% {
    -webkit-transform: translateX(26px);
    transform: translateX(26px);
  }
  65% {
    -webkit-transform: translateX(13px);
    transform: translateX(13px);
  }
  82% {
    -webkit-transform: translateX(6.5px);
    transform: translateX(6.5px);
  }
  93% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  25%,
  55%,
  75%,
  87%,
  98% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
    opacity: 1;
  }
}

/* heartbeat */
.hrtBt {
  -webkit-animation-name: hrtBt;
  animation-name: hrtBt;
}
@-webkit-keyframes hrtBt {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
  10% {
    -webkit-transform: scale(0.91);
    transform: scale(0.91);
  }
  17% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
  }
  33% {
    -webkit-transform: scale(0.87);
    transform: scale(0.87);
  }
  45% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes hrtBt {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
  10% {
    -webkit-transform: scale(0.91);
    transform: scale(0.91);
  }
  17% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
  }
  33% {
    -webkit-transform: scale(0.87);
    transform: scale(0.87);
  }
  45% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* pulsate-bck */
.plsBck {
  -webkit-animation-name: plsBck;
  animation-name: plsBck;
}
@-webkit-keyframes plsBck {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes plsBck {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* ping */
.ping {
  -webkit-animation-name: ping;
  animation-name: ping;
}
@-webkit-keyframes ping {
  0% {
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0.8;
  }
  80% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(2.2);
    transform: scale(2.2);
    opacity: 0;
  }
}
@keyframes ping {
  0% {
    -webkit-transform: scale(0.2);
    transform: scale(0.2);
    opacity: 0.8;
  }
  80% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(2.2);
    transform: scale(2.2);
    opacity: 0;
  }
}

/* pulsate-fwd */
.plsFwd {
  -webkit-animation-name: plsFwd;
  animation-name: plsFwd;
}
@-webkit-keyframes plsFwd {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}
@keyframes plsFwd {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/* blink-1 */
.blnkSl {
  -webkit-animation-name: blnkSl;
  animation-name: blnkSl;
}
@-webkit-keyframes blnkSl {
  0%,
  50%,
  100% {
    opacity: 1;
  }
  25%,
  75% {
    opacity: 0;
  }
}
@keyframes blnkSl {
  0%,
  50%,
  100% {
    opacity: 1;
  }
  25%,
  75% {
    opacity: 0;
  }
}

/* blink-2 */
.blnkFs {
  -webkit-animation-name: blnkFs;
  animation-name: blnkFs;
}
@-webkit-keyframes blnkFs {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}
@keyframes blnkFs {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
  100% {
    opacity: 1;
  }
}

/* rotate-center */
.rotCntr {
  -webkit-animation-name: rotCntr;
  animation-name: rotCntr;
}
@-webkit-keyframes rotCntr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotCntr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/* rotate-top */
.rotTp {
  -webkit-animation-name: rotTp;
  animation-name: rotTp;
}
@-webkit-keyframes rotTp {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
}
@keyframes rotTp {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
}

/* rotate-left */
.rotLft {
  -webkit-animation-name: rotLft;
  animation-name: rotLft;
}
@-webkit-keyframes rotLft {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
}
@keyframes rotLft {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
}

/* rotate-vert-center */
.rotYCntr {
  -webkit-animation-name: rotYCntr;
  animation-name: rotYCntr;
}
@-webkit-keyframes rotYCntr {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}
@keyframes rotYCntr {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
  }
}

/* rotate-vert-left */
.rotYLft {
  -webkit-animation-name: rotYLft;
  animation-name: rotYLft;
}
@-webkit-keyframes rotYLft {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
}
@keyframes rotYLft {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
  100% {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
    -webkit-transform-origin: left;
    transform-origin: left;
  }
}

/* rotate-vert-right */
.rotYRgt {
  -webkit-animation-name: rotYRgt;
  animation-name: rotYRgt;
}
@-webkit-keyframes rotYRgt {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  100% {
    -webkit-transform: rotateY(-360deg);
    transform: rotateY(-360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
}
@keyframes rotYRgt {
  0% {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  100% {
    -webkit-transform: rotateY(-360deg);
    transform: rotateY(-360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
}

/* rotate-tr */
.rotTr {
  -webkit-animation-name: rotTr;
  animation-name: rotTr;
}
@-webkit-keyframes rotTr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top right;
    transform-origin: top right;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
  }
}
@keyframes rotTr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top right;
    transform-origin: top right;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
  }
}

/* rotate-right */
.rotRgt {
  -webkit-animation-name: rotRgt;
  animation-name: rotRgt;
}
@-webkit-keyframes rotRgt {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
}
@keyframes rotRgt {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: right;
    transform-origin: right;
  }
}

/* rotate-diagonal-1 */
.rotDgnlLft {
  -webkit-animation-name: rotDgnlLft;
  animation-name: rotDgnlLft;
}
@-webkit-keyframes rotDgnlLft {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, -180deg);
    transform: rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
    transform: rotate3d(1, 1, 0, -360deg);
  }
}
@keyframes rotDgnlLft {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, -180deg);
    transform: rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
    transform: rotate3d(1, 1, 0, -360deg);
  }
}

/* rotate-hor-center */
.rotXCntr {
  -webkit-animation-name: rotXCntr;
  animation-name: rotXCntr;
}
@-webkit-keyframes rotXCntr {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
  }
  100% {
    -webkit-transform: rotateX(-360deg);
    transform: rotateX(-360deg);
  }
}
@keyframes rotXCntr {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
  }
  100% {
    -webkit-transform: rotateX(-360deg);
    transform: rotateX(-360deg);
  }
}

/* rotate-br */
.rotBr {
  -webkit-animation-name: rotBr;
  animation-name: rotBr;
}
@-webkit-keyframes rotBr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
}
@keyframes rotBr {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: bottom right;
    transform-origin: bottom right;
  }
}

/* rotate-hor-top */
.rotXTp {
  -webkit-animation-name: rotXTp;
  animation-name: rotXTp;
}
@-webkit-keyframes rotXTp {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
  100% {
    -webkit-transform: rotateX(-360deg);
    transform: rotateX(-360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
}
@keyframes rotXTp {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
  100% {
    -webkit-transform: rotateX(-360deg);
    transform: rotateX(-360deg);
    -webkit-transform-origin: top;
    transform-origin: top;
  }
}

/* rotate-bottom */
.rotBtm {
  -webkit-animation-name: rotBtm;
  animation-name: rotBtm;
}
@-webkit-keyframes rotBtm {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
}
@keyframes rotBtm {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
}

/* rotate-hor-bottom */
.rotXBtm {
  -webkit-animation-name: rotXBtm;
  animation-name: rotXBtm;
}
@-webkit-keyframes rotXBtm {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
  100% {
    -webkit-transform: rotateX(360deg);
    transform: rotateX(360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
}
@keyframes rotXBtm {
  0% {
    -webkit-transform: rotateX(0);
    transform: rotateX(0);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
  100% {
    -webkit-transform: rotateX(360deg);
    transform: rotateX(360deg);
    -webkit-transform-origin: bottom;
    transform-origin: bottom;
  }
}

/* rotate-diagonal-tr */
.rotDgnlTr {
  -webkit-animation-name: rotDgnlTr;
  animation-name: rotDgnlTr;
}
@-webkit-keyframes rotDgnlTr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, -180deg);
    transform: rotate3d(1, 1, 0, -180deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
    transform: rotate3d(1, 1, 0, -360deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}
@keyframes rotDgnlTr {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, -180deg);
    transform: rotate3d(1, 1, 0, -180deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, -360deg);
    transform: rotate3d(1, 1, 0, -360deg);
    -webkit-transform-origin: 100% 0%;
    transform-origin: 100% 0%;
  }
}

/* rotate-diagonal-2 */
.rotDgnlRgt {
  -webkit-animation-name: rotDgnlRgt;
  animation-name: rotDgnlRgt;
}
@-webkit-keyframes rotDgnlRgt {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: rotate3d(-1, 1, 0, 180deg);
    transform: rotate3d(-1, 1, 0, 180deg);
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 360deg);
    transform: rotate3d(-1, 1, 0, 360deg);
  }
}
@keyframes rotDgnlRgt {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: rotate3d(-1, 1, 0, 180deg);
    transform: rotate3d(-1, 1, 0, 180deg);
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 360deg);
    transform: rotate3d(-1, 1, 0, 360deg);
  }
}

/* rotate-diagonal-tl */
.rotDgnlTl {
  -webkit-animation-name: rotDgnlTl;
  animation-name: rotDgnlTl;
}
@-webkit-keyframes rotDgnlTl {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
  50% {
    -webkit-transform: rotate3d(-1, 1, 0, 180deg);
    transform: rotate3d(-1, 1, 0, 180deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 360deg);
    transform: rotate3d(-1, 1, 0, 360deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
}
@keyframes rotDgnlTl {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
  50% {
    -webkit-transform: rotate3d(-1, 1, 0, 180deg);
    transform: rotate3d(-1, 1, 0, 180deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, 360deg);
    transform: rotate3d(-1, 1, 0, 360deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
  }
}

/* rotate-bl */
.rotBl {
  -webkit-animation-name: rotBl;
  animation-name: rotBl;
}
@-webkit-keyframes rotBl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
}
@keyframes rotBl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: bottom left;
    transform-origin: bottom left;
  }
}

/* rotate-diagonal-br */
.rotDgnlBr {
  -webkit-animation-name: rotDgnlBr;
  animation-name: rotDgnlBr;
}
@-webkit-keyframes rotDgnlBr {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
  50% {
    -webkit-transform: rotate3d(-1, 1, 0, -180deg);
    transform: rotate3d(-1, 1, 0, -180deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, -360deg);
    transform: rotate3d(-1, 1, 0, -360deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
}
@keyframes rotDgnlBr {
  0% {
    -webkit-transform: rotate3d(-1, 1, 0, 0deg);
    transform: rotate3d(-1, 1, 0, 0deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
  50% {
    -webkit-transform: rotate3d(-1, 1, 0, -180deg);
    transform: rotate3d(-1, 1, 0, -180deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
  100% {
    -webkit-transform: rotate3d(-1, 1, 0, -360deg);
    transform: rotate3d(-1, 1, 0, -360deg);
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
  }
}

/* rotate-diagonal-bl */
.rotDgnlBl {
  -webkit-animation-name: rotDgnlBl;
  animation-name: rotDgnlBl;
}
@-webkit-keyframes rotDgnlBl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, 180deg);
    transform: rotate3d(1, 1, 0, 180deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 360deg);
    transform: rotate3d(1, 1, 0, 360deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
  }
}
@keyframes rotDgnlBl {
  0% {
    -webkit-transform: rotate3d(1, 1, 0, 0deg);
    transform: rotate3d(1, 1, 0, 0deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
  }
  50% {
    -webkit-transform: rotate3d(1, 1, 0, 180deg);
    transform: rotate3d(1, 1, 0, 180deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
  }
  100% {
    -webkit-transform: rotate3d(1, 1, 0, 360deg);
    transform: rotate3d(1, 1, 0, 360deg);
    -webkit-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
  }
}

/* rotate-tl */
.rotTl {
  -webkit-animation-name: rotTl;
  animation-name: rotTl;
}
@-webkit-keyframes rotTl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
  }
}
@keyframes rotTl {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
    -webkit-transform-origin: top left;
    transform-origin: top left;
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
  }
}

/* rotate-scale-up */
.rotSclUp {
  -webkit-animation-name: rotSclUp;
  animation-name: rotSclUp;
}
@-webkit-keyframes rotSclUp {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(2) rotateZ(180deg);
    transform: scale(2) rotateZ(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}
@keyframes rotSclUp {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(2) rotateZ(180deg);
    transform: scale(2) rotateZ(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}

/* rotate-scale-down */
.rotSclDwn {
  -webkit-animation-name: rotSclDwn;
  animation-name: rotSclDwn;
}
@-webkit-keyframes rotSclDwn {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(0.5) rotateZ(180deg);
    transform: scale(0.5) rotateZ(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}
@keyframes rotSclDwn {
  0% {
    -webkit-transform: scale(1) rotateZ(0);
    transform: scale(1) rotateZ(0);
  }
  50% {
    -webkit-transform: scale(0.5) rotateZ(180deg);
    transform: scale(0.5) rotateZ(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateZ(360deg);
    transform: scale(1) rotateZ(360deg);
  }
}

/* rotate-scale-up-hor */
.rotSclUpX {
  -webkit-animation-name: rotSclUpX;
  animation-name: rotSclUpX;
}
@-webkit-keyframes rotSclUpX {
  0% {
    -webkit-transform: scale(1) rotateX(0);
    transform: scale(1) rotateX(0);
  }
  50% {
    -webkit-transform: scale(2) rotateX(-180deg);
    transform: scale(2) rotateX(-180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateX(-360deg);
    transform: scale(1) rotateX(-360deg);
  }
}
@keyframes rotSclUpX {
  0% {
    -webkit-transform: scale(1) rotateX(0);
    transform: scale(1) rotateX(0);
  }
  50% {
    -webkit-transform: scale(2) rotateX(-180deg);
    transform: scale(2) rotateX(-180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateX(-360deg);
    transform: scale(1) rotateX(-360deg);
  }
}

/* rotate-scale-down-hor */
.rotSclDwnX {
  -webkit-animation-name: rotSclDwnX;
  animation-name: rotSclDwnX;
}
@-webkit-keyframes rotSclDwnX {
  0% {
    -webkit-transform: scale(1) rotateX(0);
    transform: scale(1) rotateX(0);
  }
  50% {
    -webkit-transform: scale(0.5) rotateX(-180deg);
    transform: scale(0.5) rotateX(-180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateX(-360deg);
    transform: scale(1) rotateX(-360deg);
  }
}
@keyframes rotSclDwnX {
  0% {
    -webkit-transform: scale(1) rotateX(0);
    transform: scale(1) rotateX(0);
  }
  50% {
    -webkit-transform: scale(0.5) rotateX(-180deg);
    transform: scale(0.5) rotateX(-180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateX(-360deg);
    transform: scale(1) rotateX(-360deg);
  }
}

/* rotate-scale-up-ver */
.rotSclUpY {
  -webkit-animation-name: rotSclUpY;
  animation-name: rotSclUpY;
}
@-webkit-keyframes rotSclUpY {
  0% {
    -webkit-transform: scale(1) rotateY(0);
    transform: scale(1) rotateY(0);
  }
  50% {
    -webkit-transform: scale(2) rotateY(180deg);
    transform: scale(2) rotateY(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateY(360deg);
    transform: scale(1) rotateY(360deg);
  }
}
@keyframes rotSclUpY {
  0% {
    -webkit-transform: scale(1) rotateY(0);
    transform: scale(1) rotateY(0);
  }
  50% {
    -webkit-transform: scale(2) rotateY(180deg);
    transform: scale(2) rotateY(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateY(360deg);
    transform: scale(1) rotateY(360deg);
  }
}

/* rotate-scale-down-ver */
.rotSclDwnY {
  -webkit-animation-name: rotSclDwnY;
  animation-name: rotSclDwnY;
}
@-webkit-keyframes rotSclDwnY {
  0% {
    -webkit-transform: scale(1) rotateY(0);
    transform: scale(1) rotateY(0);
  }
  50% {
    -webkit-transform: scale(0.5) rotateY(180deg);
    transform: scale(0.5) rotateY(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateY(360deg);
    transform: scale(1) rotateY(360deg);
  }
}
@keyframes rotSclDwnY {
  0% {
    -webkit-transform: scale(1) rotateY(0);
    transform: scale(1) rotateY(0);
  }
  50% {
    -webkit-transform: scale(0.5) rotateY(180deg);
    transform: scale(0.5) rotateY(180deg);
  }
  100% {
    -webkit-transform: scale(1) rotateY(360deg);
    transform: scale(1) rotateY(360deg);
  }
}

/* rotate-scale-up-diag-1 */
.rotSclUpDgnlLft {
  -webkit-animation-name: rotSclUpDgnlLft;
  animation-name: rotSclUpDgnlLft;
}
@-webkit-keyframes rotSclUpDgnlLft {
  0% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, 0deg);
    transform: scale(1) rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(2) rotate3d(1, 1, 0, -180deg);
    transform: scale(2) rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, -360deg);
    transform: scale(1) rotate3d(1, 1, 0, -360deg);
  }
}
@keyframes rotSclUpDgnlLft {
  0% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, 0deg);
    transform: scale(1) rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(2) rotate3d(1, 1, 0, -180deg);
    transform: scale(2) rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, -360deg);
    transform: scale(1) rotate3d(1, 1, 0, -360deg);
  }
}

/* rotate-scale-down-diag-1 */
.rotSclDwnDgnlLft {
  -webkit-animation-name: rotSclDwnDgnlLft;
  animation-name: rotSclDwnDgnlLft;
}
@-webkit-keyframes rotSclDwnDgnlLft {
  0% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, 0deg);
    transform: scale(1) rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate3d(1, 1, 0, -180deg);
    transform: scale(0.5) rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, -360deg);
    transform: scale(1) rotate3d(1, 1, 0, -360deg);
  }
}
@keyframes rotSclDwnDgnlLft {
  0% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, 0deg);
    transform: scale(1) rotate3d(1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate3d(1, 1, 0, -180deg);
    transform: scale(0.5) rotate3d(1, 1, 0, -180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(1, 1, 0, -360deg);
    transform: scale(1) rotate3d(1, 1, 0, -360deg);
  }
}

/* rotate-scale-up-diag-2 */
.rotSclUpDgnlRgt {
  -webkit-animation-name: rotSclUpDgnlRgt;
  animation-name: rotSclUpDgnlRgt;
}
@-webkit-keyframes rotSclUpDgnlRgt {
  0% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 0deg);
    transform: scale(1) rotate3d(-1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(2) rotate3d(-1, 1, 0, 180deg);
    transform: scale(2) rotate3d(-1, 1, 0, 180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 360deg);
    transform: scale(1) rotate3d(-1, 1, 0, 360deg);
  }
}
@keyframes rotSclUpDgnlRgt {
  0% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 0deg);
    transform: scale(1) rotate3d(-1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(2) rotate3d(-1, 1, 0, 180deg);
    transform: scale(2) rotate3d(-1, 1, 0, 180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 360deg);
    transform: scale(1) rotate3d(-1, 1, 0, 360deg);
  }
}

/* rotate-scale-down-diag-2 */
.rotSclDwnDgnlRgt {
  -webkit-animation-name: rotSclDwnDgnlRgt;
  animation-name: rotSclDwnDgnlRgt;
}
@-webkit-keyframes rotSclDwnDgnlRgt {
  0% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 0deg);
    transform: scale(1) rotate3d(-1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate3d(-1, 1, 0, 180deg);
    transform: scale(0.5) rotate3d(-1, 1, 0, 180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 360deg);
    transform: scale(1) rotate3d(-1, 1, 0, 360deg);
  }
}
@keyframes rotSclDwnDgnlRgt {
  0% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 0deg);
    transform: scale(1) rotate3d(-1, 1, 0, 0deg);
  }
  50% {
    -webkit-transform: scale(0.5) rotate3d(-1, 1, 0, 180deg);
    transform: scale(0.5) rotate3d(-1, 1, 0, 180deg);
  }
  100% {
    -webkit-transform: scale(1) rotate3d(-1, 1, 0, 360deg);
    transform: scale(1) rotate3d(-1, 1, 0, 360deg);
  }
}