.row {
  margin-right: 1px;
  margin-left: 1px;
}

.row:before,
.row:after {
  display: table;
  content: " ";
}

.row:after {
  clear: both;
}

.row:before,
.row:after {
  display: table;
  content: " ";
}

.row:after {
  clear: both;
}




.divselect{
  /*
  position: absolute;
        display:none;
       margin-top: -2em ;
      
backface-visibility:hidden;
    background-color:white;
  */

      border: 1px solid cornflowerblue;
}

.paddingL{
    padding:8px 8px 8px 4px
}

.paddingsmall{
    padding: 8px 8px 8px 8px;
    border-bottom:solid 1px #ccc

}


.bpnael{
 /* display:none*/
 display:none;
}

.imbor:hover {
  border: 2px solid  #ffcc00;
}
.mover ,.nobor{
   border:none
}

.moverz{
    border: 1px solid #f1f1f1;
}

.mover:hover ,.moverz:hover {
  border: 1px solid cornflowerblue;
  
     
      
}

.mover:hover .bpnael {
 
        display:block
}


.test{
    font-size:s;
   
  left:auto;
  background-color:dimgray;
  width:100%;
  right:auto;

 padding:4px;
 background-image:none;

     
}
sdsvelx {
    border:solid;
    background-color:dimgray;
    border-bottom-width:2px;

        border-radius:7px;
}


.sdsvel {
    transform: scale(0.5);
}

.borderbuttom {
    border-bottom: 1px solid #ddd;
}

.padbut {
    padding-bottom:5px
}


.sLi1 {
    color: #0066FF;
    background-color:white;
    border:1px solid #f1f1f1;
    text-underline-position:unset

}

.sdrp {
   border:solid 1px #f1f1f1;
}

.slabel {
    border: solid 1px #acabab;
    padding:0px 3px;
    background-color:lightyellow;
    color:dimgray;
    text-decoration:none;
    font-size:small;
   
}

.slapree {
    border: solid 1px cornflowerblue;
    padding: 3px 3px;
    background-color: white;
    color: black;
    text-decoration: none;
    font-size: small;
}
.nextpre {
    width: 600px;
    /* position: absolute;

	margin:20px auto;
    */
    text-align: center;
    position: absolute;
    padding:10px;
}
.buttonnav {
    background-color: white;
    color: darkgrey;
    border: 2px solid #ddd;
border-radius: 12px;
height:30px;
}
.buttonnav:hover {
    background-color: lightgray;
    color: dimgray;
    border: 2px solid #ddd;
}



.slide-tr {
    animation: slide-tr .5s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes slide-tr {
    0% {
        transform: translateY(0) translateX(0)
    }

    100% {
        transform: translateY(-100px) translateX(100px)
    }
}
.scale-up-hor-center {
    animation: scale-up-hor-center .4s cubic-bezier(.39,.575,.565,1.000) both
}
@keyframes scale-up-hor-center {
    0% {
        transform: scaleX(.4)
    }

    100% {
        transform: scaleX(1)
    }
}

.scale-up-center {
    animation: scale-up-center .4s cubic-bezier(.39,.575,.565,1.000) both
}
@keyframes scale-up-center {
    0% {
        transform: scale(.5)
    }

    100% {
        transform: scale(1)
    }
}

.scale-up-bl {
    animation: scale-up-bl .4s cubic-bezier(.39,.575,.565,1.000) both
}
@keyframes scale-up-bl {
    0% {
        transform: scale(.5);
        transform-origin: 0 100%
    }

    100% {
        transform: scale(1);
        transform-origin: 0 100%
    }
}

.scale-down-center {
    animation: scale-down-center .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes scale-down-center {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(.5)
    }
}

.scale-down-bl {
    animation: scale-down-bl .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes scale-down-bl {
    0% {
        transform: scale(1);
        transform-origin: 0 100%
    }

    100% {
        transform: scale(.5);
        transform-origin: 0 100%
    }
}

.scale-down-br {
    animation: scale-down-br .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes scale-down-br {
    0% {
        transform: scale(1);
        transform-origin: 100% 100%
    }

    100% {
        transform: scale(.5);
        transform-origin: 100% 100%
    }
}

.scale-down-bottom {
    animation: scale-down-bottom .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes scale-down-bottom {
    0% {
        transform: scale(1);
        transform-origin: 50% 100%
    }

    100% {
        transform: scale(.5);
        transform-origin: 50% 100%
    }
}

.rotate-scale-up {
    animation: rotate-scale-up .65s linear both
}
@keyframes rotate-scale-up {
    0% {
        transform: scale(1) rotateZ(0)
    }

    50% {
        transform: scale(2) rotateZ(180deg)
    }

    100% {
        transform: scale(1) rotateZ(360deg)
    }
}

.rotate-scale-down {
    animation: rotate-scale-down .65s linear both
}
@keyframes rotate-scale-down {
    0% {
        transform: scale(1) rotateZ(0)
    }

    50% {
        transform: scale(.5) rotateZ(180deg)
    }

    100% {
        transform: scale(1) rotateZ(360deg)
    }
}

.rotate-scale-up-hor {
    animation: rotate-scale-up-hor .65s linear both
}
@keyframes rotate-scale-up-hor {
    0% {
        transform: scale(1) rotateX(0)
    }

    50% {
        transform: scale(2) rotateX(-180deg)
    }

    100% {
        transform: scale(1) rotateX(-360deg)
    }
}

.rotate-scale-down-hor {
    animation: rotate-scale-down-hor .65s linear both
}
@keyframes rotate-scale-down-hor {
    0% {
        transform: scale(1) rotateX(0)
    }

    50% {
        transform: scale(.5) rotateX(-180deg)
    }

    100% {
        transform: scale(1) rotateX(-360deg)
    }
}

.rotate-scale-up-diag-1 {
    animation: rotate-scale-up-diag-1 .7s linear both
}

@keyframes rotate-scale-up-diag-1 {
    0% {
        transform: scale(1) rotate3d(1,1,0,0deg)
    }

    50% {
        transform: scale(2) rotate3d(1,1,0,-180deg)
    }

    100% {
        transform: scale(1) rotate3d(1,1,0,-360deg)
    }
}

.rotate-scale-down-diag-1 {
    animation: rotate-scale-down-diag-1 .7s linear both
}
@keyframes rotate-scale-down-diag-1 {
    0% {
        transform: scale(1) rotate3d(1,1,0,0deg)
    }

    50% {
        transform: scale(.5) rotate3d(1,1,0,-180deg)
    }

    100% {
        transform: scale(1) rotate3d(1,1,0,-360deg)
    }
}

.rotate-90-cw {
    animation: rotate-90-cw .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes rotate-90-cw {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(90deg)
    }
}

.rotate-90-ccw {
    animation: rotate-90-ccw .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes rotate-90-ccw {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(-90deg)
    }
}

.rotate-90-tr-cw {
    animation: rotate-90-tr-cw .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes rotate-90-tr-cw {
    0% {
        transform: rotate(0);
        transform-origin: top right
    }

    100% {
        transform: rotate(90deg);
        transform-origin: top right
    }
}

.flip-horizontal-bottom {
    animation: flip-horizontal-bottom .4s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes flip-horizontal-bottom {
    0% {
        transform: rotateX(0)
    }

    100% {
        transform: rotateX(-180deg)
    }
}

.flip-horizontal-fwd {
    animation: flip-horizontal-fwd .4s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes flip-horizontal-fwd {
    0% {
        transform: translateZ(0) rotateX(0)
    }

    100% {
        transform: translateZ(160px) rotateX(-180deg)
    }
}

.flip-diagonal-1-bl {
    animation: flip-diagonal-1-bl .4s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes flip-diagonal-1-bl {
    0% {
        transform: rotate3d(1,1,0,0deg)
    }

    100% {
        transform: rotate3d(1,1,0,-180deg)
    }
}

.flip-diagonal-1-bck {
    animation: flip-diagonal-1-bck .4s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes flip-diagonal-1-bck {
    0% {
        transform: translateZ(0) rotate3d(1,1,0,0deg)
    }

    100% {
        transform: translateZ(-260px) rotate3d(1,1,0,-180deg)
    }
}

.flip-2-hor-top-bck {
    animation: flip-2-hor-top-bck .5s cubic-bezier(.455,.03,.515,.955) both
}

@keyframes flip-2-hor-top-bck {
    0% {
        transform: translateY(0) translateZ(0) rotateX(0);
        transform-origin: 50% 0
    }

    100% {
        transform: translateY(-100%) translateZ(-260px) rotateX(180deg);
        transform-origin: 50% 100%
    }
}

.flip-2-ver-left-1 {
    animation: flip-2-ver-left-1 .5s cubic-bezier(.455,.03,.515,.955) both
}

@keyframes flip-2-ver-left-1 {
    0% {
        transform: translateX(0) rotateY(0);
        transform-origin: 0 50%
    }

    100% {
        transform: translateX(-100%) rotateY(180deg);
        transform-origin: 100% 0
    }
}

.flip-2-ver-left-bck {
    animation: flip-2-ver-left-bck .5s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes flip-2-ver-left-bck {
    0% {
        transform: translateX(0) translateZ(0) rotateY(0);
        transform-origin: 0 50%
    }

    100% {
        transform: translateX(-100%) translateZ(-260px) rotateY(-180deg);
        transform-origin: 100% 0
    }
}

.flip-2-ver-left-fwd {
    animation: flip-2-ver-left-fwd .5s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes flip-2-ver-left-fwd {
    0% {
        transform: translateX(0) translateZ(0) rotateY(0);
        transform-origin: 0 50%
    }

    100% {
        transform: translateX(-100%) translateZ(160px) rotateY(180deg);
        transform-origin: 100% 0
    }
}

.flip-scale-down-ver {
    animation: flip-scale-down-ver .5s linear both
}
@keyframes flip-scale-down-ver {
    0% {
        transform: scale(1) rotateY(0)
    }

    50% {
        transform: scale(.4) rotateY(-90deg)
    }

    100% {
        transform: scale(1) rotateY(-180deg)
    }
}

.swing-left-bck {
    animation: swing-left-bck .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes swing-left-bck {
    0% {
        transform: rotateY(0);
        transform-origin: left bottom
    }

    100% {
        transform: rotateY(180deg);
        transform-origin: left bottom
    }
}

.swing-right-fwd {
    animation: swing-right-fwd .4s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes swing-right-fwd {
    0% {
        transform: rotateY(0);
        transform-origin: right
    }

    100% {
        transform: rotateY(180deg);
        transform-origin: right
    }
}

.slide-tl {
    animation: slide-tl .5s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes slide-tl {
    0% {
        transform: translateY(0) translateX(0)
    }

    100% {
        transform: translateY(-100px) translateX(-100px)
    }
}


.tracking-in-contract-bck {
    animation: tracking-in-contract-bck 1s cubic-bezier(.215,.61,.355,1.000) both
}

@keyframes tracking-in-contract-bck {
    0% {
        letter-spacing: 1em;
        transform: translateZ(400px);
        opacity: 0
    }

    40% {
        opacity: .6
    }

    100% {
        transform: translateZ(0);
        opacity: 1
    }
}

.tracking-in-expand {
    animation: tracking-in-expand .7s cubic-bezier(.215,.61,.355,1.000) both
}
@keyframes tracking-in-expand {
    0% {
        letter-spacing: -.5em;
        opacity: 0
    }

    40% {
        opacity: .6
    }

    100% {
        opacity: 1
    }
}

.tracking-in-expand-fwd-top {
    animation: tracking-in-expand-fwd-top .8s cubic-bezier(.215,.61,.355,1.000) both
}
@keyframes tracking-in-expand-fwd-top {
    0% {
        letter-spacing: -.5em;
        transform: translateZ(-700px) translateY(-500px);
        opacity: 0
    }

    40% {
        opacity: .6
    }

    100% {
        transform: translateZ(0) translateY(0);
        opacity: 1
    }
}

.tracking-out-expand {
    animation: tracking-out-expand .8s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes tracking-out-expand {
    0% {
        opacity: 1
    }

    60% {
        opacity: .8
    }

    100% {
        letter-spacing: 1em;
        opacity: 0
    }
}

.focus-in-contract-bck {
    animation: focus-in-contract-bck 1s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes focus-in-contract-bck {
    0% {
        letter-spacing: 1em;
        transform: translateZ(300px);
        filter: blur(12px);
        opacity: 0
    }

    100% {
        transform: translateZ(12px);
        filter: blur(0);
        opacity: 1
    }
}

.blur-out-contract {
    animation: blur-out-contract 1s cubic-bezier(.55,.085,.68,.53) both
}
@keyframes blur-out-contract {
    0% {
        filter: blur(.01)
    }

    100% {
        letter-spacing: -.5em;
        filter: blur(12px) opacity(0)
    }
}

.text-flicker-in-glow {
    animation: text-flicker-in-glow 4s linear both
}
@keyframes text-flicker-in-glow {
    0% {
        opacity: 0
    }

    10% {
        opacity: 0;
        text-shadow: none
    }

    10.1% {
        opacity: 1;
        text-shadow: none
    }

    10.2% {
        opacity: 0;
        text-shadow: none
    }

    20% {
        opacity: 0;
        text-shadow: none
    }

    20.1% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.25)
    }

    20.6% {
        opacity: 0;
        text-shadow: none
    }

    30% {
        opacity: 0;
        text-shadow: none
    }

    30.1% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.45),0 0 60px rgba(255,255,255,.25)
    }

    30.5% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.45),0 0 60px rgba(255,255,255,.25)
    }

    30.6% {
        opacity: 0;
        text-shadow: none
    }

    45% {
        opacity: 0;
        text-shadow: none
    }

    45.1% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.45),0 0 60px rgba(255,255,255,.25)
    }

    50% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.45),0 0 60px rgba(255,255,255,.25)
    }

    55% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.45),0 0 60px rgba(255,255,255,.25)
    }

    55.1% {
        opacity: 0;
        text-shadow: none
    }

    57% {
        opacity: 0;
        text-shadow: none
    }

    57.1% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.55),0 0 60px rgba(255,255,255,.35)
    }

    60% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.55),0 0 60px rgba(255,255,255,.35)
    }

    60.1% {
        opacity: 0;
        text-shadow: none
    }

    65% {
        opacity: 0;
        text-shadow: none
    }

    65.1% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.55),0 0 60px rgba(255,255,255,.35),0 0 100px rgba(255,255,255,.1)
    }

    75% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.55),0 0 60px rgba(255,255,255,.35),0 0 100px rgba(255,255,255,.1)
    }

    75.1% {
        opacity: 0;
        text-shadow: none
    }

    77% {
        opacity: 0;
        text-shadow: none
    }

    77.1% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.55),0 0 60px rgba(255,255,255,.4),0 0 110px rgba(255,255,255,.2),0 0 100px rgba(255,255,255,.1)
    }

    85% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.55),0 0 60px rgba(255,255,255,.4),0 0 110px rgba(255,255,255,.2),0 0 100px rgba(255,255,255,.1)
    }

    85.1% {
        opacity: 0;
        text-shadow: none
    }

    86% {
        opacity: 0;
        text-shadow: none
    }

    86.1% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.6),0 0 60px rgba(255,255,255,.45),0 0 110px rgba(255,255,255,.25),0 0 100px rgba(255,255,255,.1)
    }

    100% {
        opacity: 1;
        text-shadow: 0 0 30px rgba(255,255,255,.6),0 0 60px rgba(255,255,255,.45),0 0 110px rgba(255,255,255,.25),0 0 100px rgba(255,255,255,.1)
    }
}

.text-shadow-drop-center {
    animation: text-shadow-drop-center .6s both
}
@keyframes text-shadow-drop-center {
    0% {
        text-shadow: 0 0 0 transparent
    }

    100% {
        text-shadow: 0 0 18px rgba(0,0,0,.35)
    }
}

.text-shadow-pop-right {
    animation: text-shadow-pop-right .6s both
}
@keyframes text-shadow-pop-right {
    0% {
        text-shadow: 0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555,0 0 #555;
        transform: translateX(0)
    }

    100% {
        text-shadow: 1px 0 #555,2px 0 #555,3px 0 #555,4px 0 #555,5px 0 #555,6px 0 #555,7px 0 #555,8px 0 #555;
        transform: translateX(-8px)
    }
}

.text-pop-up-top {
    animation: text-pop-up-top .5s cubic-bezier(.25,.46,.45,.94) both
}
@keyframes text-pop-up-top {
    0% {
        transform: translateY(0);
        transform-origin: 50% 50%;
        text-shadow: none
    }

    100% {
        transform: translateY(-50px);
        transform-origin: 50% 50%;
        text-shadow: 0 1px 0 #ccc,0 2px 0 #ccc,0 3px 0 #ccc,0 4px 0 #ccc,0 5px 0 #ccc,0 6px 0 #ccc,0 7px 0 #ccc,0 8px 0 #ccc,0 9px 0 #ccc,0 50px 30px rgba(0,0,0,.3)
    }
}

.vibrate-2 {
    animation: vibrate-2 .3s linear infinite both
}
@keyframes vibrate-2 {
    0% {
        transform: translate(0)
    }

    20% {
        transform: translate(2px,-2px)
    }

    40% {
        transform: translate(2px,2px)
    }

    60% {
        transform: translate(-2px,2px)
    }

    80% {
        transform: translate(-2px,-2px)
    }

    100% {
        transform: translate(0)
    }
}

.flicker-1 {
    animation: flicker-1 2s linear infinite both
}
@keyframes flicker-1 {
    0%,100% {
        opacity: 1
    }

    41.99% {
        opacity: 1
    }

    42% {
        opacity: 0
    }

    43% {
        opacity: 0
    }

    43.01% {
        opacity: 1
    }

    47.99% {
        opacity: 1
    }

    48% {
        opacity: 0
    }

    49% {
        opacity: 0
    }

    49.01% {
        opacity: 1
    }
}

.flicker-5 {
    animation: flicker-5 8s linear infinite both
}
@keyframes flicker-5 {
    0%,100% {
        opacity: 1
    }

    0% {
        opacity: 1
    }

    1% {
        opacity: 1
    }

    1.02% {
        opacity: 1
    }

    8.98% {
        opacity: 1
    }

    9% {
        opacity: 0
    }

    9.8% {
        opacity: 0
    }

    9.82% {
        opacity: 1
    }

    9.48% {
        opacity: 1
    }

    9.5% {
        opacity: 1
    }

    9.6% {
        opacity: 1
    }

    9.62% {
        opacity: 1
    }

    14.98% {
        opacity: 1
    }

    15% {
        opacity: .5
    }

    15.8% {
        opacity: .5
    }

    15.82% {
        opacity: 1
    }

    15.18% {
        opacity: 1
    }

    15.2% {
        opacity: .7
    }

    16% {
        opacity: .7
    }

    16.02% {
        opacity: 1
    }

    15.48% {
        opacity: 1
    }

    15.5% {
        opacity: .5
    }

    16.2% {
        opacity: .5
    }

    16.22% {
        opacity: 1
    }

    16.98% {
        opacity: 1
    }

    17% {
        opacity: 1
    }

    17.8% {
        opacity: 1
    }

    17.82% {
        opacity: 1
    }

    20.48% {
        opacity: 1
    }

    20.5% {
        opacity: .9
    }

    21.3% {
        opacity: .9
    }

    21.32% {
        opacity: 1
    }

    20.98% {
        opacity: 1
    }

    21% {
        opacity: 1
    }

    22% {
        opacity: 1
    }

    22.02% {
        opacity: 1
    }

    39.98% {
        opacity: 1
    }

    40% {
        opacity: 1
    }

    41% {
        opacity: 1
    }

    41.02% {
        opacity: 1
    }

    40.48% {
        opacity: 1
    }

    40.5% {
        opacity: .6
    }

    41.4% {
        opacity: .6
    }

    41.42% {
        opacity: 1
    }

    41.98% {
        opacity: 1
    }

    42% {
        opacity: 1
    }

    42.8% {
        opacity: 1
    }

    42.82% {
        opacity: 1
    }

    59.98% {
        opacity: 1
    }

    60% {
        opacity: 1
    }

    61% {
        opacity: 1
    }

    61.02% {
        opacity: 1
    }

    60.18% {
        opacity: 1
    }

    60.2% {
        opacity: .2
    }

    61% {
        opacity: .2
    }

    61.02% {
        opacity: 1
    }

    60.78% {
        opacity: 1
    }

    60.8% {
        opacity: .4
    }

    61.6% {
        opacity: .4
    }

    61.62% {
        opacity: 1
    }

    61.38% {
        opacity: 1
    }

    61.4% {
        opacity: 0
    }

    62.2% {
        opacity: 0
    }

    62.22% {
        opacity: 1
    }

    61.78% {
        opacity: 1
    }

    61.8% {
        opacity: 1
    }

    62.8% {
        opacity: 1
    }

    62.82% {
        opacity: 1
    }

    75.98% {
        opacity: 1
    }

    76% {
        opacity: 1
    }

    77% {
        opacity: 1
    }

    77.02% {
        opacity: 1
    }

    77.98% {
        opacity: 1
    }

    78% {
        opacity: .7
    }

    78.8% {
        opacity: .7
    }

    78.82% {
        opacity: 1
    }

    78.98% {
        opacity: 1
    }

    79% {
        opacity: 1
    }

    80% {
        opacity: 1
    }

    80.02% {
        opacity: 1
    }

    99.98% {
        opacity: 1
    }

    100% {
        opacity: 1
    }
}

.shake-horizontal {
    animation: shake-horizontal .8s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes shake-horizontal {
    0%,100% {
        transform: translateX(0)
    }

    10%,30%,50%,70% {
        transform: translateX(-10px)
    }

    20%,40%,60% {
        transform: translateX(10px)
    }

    80% {
        transform: translateX(8px)
    }

    90% {
        transform: translateX(-8px)
    }
}

.shake-br {
    animation: shake-br .8s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes shake-br {
    0%,100% {
        transform: rotate(0deg);
        transform-origin: 100% 100%
    }

    10% {
        transform: rotate(2deg)
    }

    20%,40%,60% {
        transform: rotate(-4deg)
    }

    30%,50%,70% {
        transform: rotate(4deg)
    }

    80% {
        transform: rotate(-2deg)
    }

    90% {
        transform: rotate(2deg)
    }
}

.shake-bl {
    animation: shake-bl .8s cubic-bezier(.455,.03,.515,.955) both
}

@keyframes shake-bl {
    0%,100% {
        transform: rotate(0deg);
        transform-origin: 0 100%
    }

    10% {
        transform: rotate(2deg)
    }

    20%,40%,60% {
        transform: rotate(-4deg)
    }

    30%,50%,70% {
        transform: rotate(4deg)
    }

    80% {
        transform: rotate(-2deg)
    }

    90% {
        transform: rotate(2deg)
    }
}

.shake-bottom {
    animation: shake-bottom .8s cubic-bezier(.455,.03,.515,.955) both
}
@keyframes shake-bottom {
    0%,100% {
        transform: rotate(0deg);
        transform-origin: 50% 100%
    }

    10% {
        transform: rotate(2deg)
    }

    20%,40%,60% {
        transform: rotate(-4deg)
    }

    30%,50%,70% {
        transform: rotate(4deg)
    }

    80% {
        transform: rotate(-2deg)
    }

    90% {
        transform: rotate(2deg)
    }
}

.jello-vertical {
    animation: jello-vertical .9s both
}

@keyframes jello-vertical {
    0% {
        transform: scale3d(1,1,1)
    }

    30% {
        transform: scale3d(.75,1.25,1)
    }

    40% {
        transform: scale3d(1.25,.75,1)
    }

    50% {
        transform: scale3d(.85,1.15,1)
    }

    65% {
        transform: scale3d(1.05,.95,1)
    }

    75% {
        transform: scale3d(.95,1.05,1)
    }

    100% {
        transform: scale3d(1,1,1)
    }
}

.wobble-hor-bottom {
    animation: wobble-hor-bottom .8s both
}
@keyframes wobble-hor-bottom {
    0%,100% {
        transform: translateX(0);
        transform-origin: 50% 50%
    }

    15% {
        transform: translateX(-30px) rotate(-6deg)
    }

    30% {
        transform: translateX(15px) rotate(6deg)
    }

    45% {
        transform: translateX(-15px) rotate(-3.6deg)
    }

    60% {
        transform: translateX(9px) rotate(2.4deg)
    }

    75% {
        transform: translateX(-6px) rotate(-1.2deg)
    }
}

.wobble-ver-right {
    animation: wobble-ver-right .8s both
}
@keyframes wobble-ver-right {
    0%,100% {
        transform: translateY(0) rotate(0);
        transform-origin: 50% 50%
    }

    15% {
        transform: translateY(-30px) rotate(6deg)
    }

    30% {
        transform: translateY(15px) rotate(-6deg)
    }

    45% {
        transform: translateY(-15px) rotate(3.6deg)
    }

    60% {
        transform: translateY(9px) rotate(-2.4deg)
    }

    75% {
        transform: translateY(-6px) rotate(1.2deg)
    }
}

.bounce-top {
    animation: bounce-top .9s both
}
@keyframes bounce-top {
    0% {
        transform: translateY(-45px);
        animation-timing-function: ease-in;
        opacity: 1
    }

    24% {
        opacity: 1
    }

    40% {
        transform: translateY(-24px);
        animation-timing-function: ease-in
    }

    65% {
        transform: translateY(-12px);
        animation-timing-function: ease-in
    }

    82% {
        transform: translateY(-6px);
        animation-timing-function: ease-in
    }

    93% {
        transform: translateY(-4px);
        animation-timing-function: ease-in
    }

    25%,55%,75%,87% {
        transform: translateY(0);
        animation-timing-function: ease-out
    }

    100% {
        transform: translateY(0);
        animation-timing-function: ease-out;
        opacity: 1
    }
}

.bounce-bottom {
    animation: bounce-bottom .9s both
}
@keyframes bounce-bottom {
    0% {
        transform: translateY(45px);
        animation-timing-function: ease-in;
        opacity: 1
    }

    24% {
        opacity: 1
    }

    40% {
        transform: translateY(24px);
        animation-timing-function: ease-in
    }

    65% {
        transform: translateY(12px);
        animation-timing-function: ease-in
    }

    82% {
        transform: translateY(6px);
        animation-timing-function: ease-in
    }

    93% {
        transform: translateY(4px);
        animation-timing-function: ease-in
    }

    25%,55%,75%,87% {
        transform: translateY(0);
        animation-timing-function: ease-out
    }

    100% {
        transform: translateY(0);
        animation-timing-function: ease-out;
        opacity: 1
    }
}

.bounce-left {
    animation: bounce-left .8s both
}
@keyframes bounce-left {
    0% {
        transform: translateX(-48px);
        animation-timing-function: ease-in;
        opacity: 1
    }

    24% {
        opacity: 1
    }

    40% {
        transform: translateX(-26px);
        animation-timing-function: ease-in
    }

    65% {
        transform: translateX(-13px);
        animation-timing-function: ease-in
    }

    82% {
        transform: translateX(-6.5px);
        animation-timing-function: ease-in
    }

    93% {
        transform: translateX(-4px);
        animation-timing-function: ease-in
    }

    25%,55%,75%,87%,98% {
        transform: translateX(0);
        animation-timing-function: ease-out
    }

    100% {
        transform: translateX(0);
        animation-timing-function: ease-out;
        opacity: 1
    }
}

.bounce-right {
    animation: bounce-right .8s both
}
@keyframes bounce-right {
    0% {
        transform: translateX(48px);
        animation-timing-function: ease-in;
        opacity: 1
    }

    24% {
        opacity: 1
    }

    40% {
        transform: translateX(26px);
        animation-timing-function: ease-in
    }

    65% {
        transform: translateX(13px);
        animation-timing-function: ease-in
    }

    82% {
        transform: translateX(6.5px);
        animation-timing-function: ease-in
    }

    93% {
        transform: translateX(4px);
        animation-timing-function: ease-in
    }

    25%,55%,75%,87%,98% {
        transform: translateX(0);
        animation-timing-function: ease-out
    }

    100% {
        transform: translateX(0);
        animation-timing-function: ease-out;
        opacity: 1
    }
}

.heartbeat {
    animation: heartbeat 1.5s ease-in-out infinite both
}
@keyframes heartbeat {
    from {
        transform: scale(1);
        transform-origin: center center;
        animation-timing-function: ease-out
    }

    10% {
        transform: scale(.91);
        animation-timing-function: ease-in
    }

    17% {
        transform: scale(.98);
        animation-timing-function: ease-out
    }

    33% {
        transform: scale(.87);
        animation-timing-function: ease-in
    }

    45% {
        transform: scale(1);
        animation-timing-function: ease-out
    }
}

.pulsate-bck {
    animation: pulsate-bck .5s ease-in-out infinite both
}
@keyframes pulsate-bck {
    0% {
        transform: scale(1)
    }

    50% {
        transform: scale(.9)
    }

    100% {
        transform: scale(1)
    }
}

.pulsate-fwd {
    animation: pulsate-fwd .5s ease-in-out infinite both
}
@keyframes pulsate-fwd {
    0% {
        transform: scale(1)
    }

    50% {
        transform: scale(1.1)
    }

    100% {
        transform: scale(1)
    }
}

.ping{animation:ping .8s ease-in-out infinite both}
@keyframes ping{0%{transform:scale(.2);opacity:.8}80%{transform:scale(1.2);opacity:0}100%{transform:scale(2.2);opacity:0}}

.blink-1{animation:blink-1 .6s both}
@keyframes blink-1{0%,50%,100%{opacity:1}25%,75%{opacity:0}}

.kenburns-top{animation:kenburns-top 5s ease-out both}
@keyframes kenburns-top{0%{transform:scale(1) translateY(0);transform-origin:50% 16%}100%{transform:scale(1.25) translateY(-15px);transform-origin:top}}
.kenburns-bottom{animation:kenburns-bottom 5s ease-out both}
@keyframes kenburns-bottom{0%{transform:scale(1) translateY(0);transform-origin:50% 84%}100%{transform:scale(1.25) translateY(15px);transform-origin:bottom}}
.kenburns-bottom-right{animation:kenburns-bottom-right 5s ease-out both}
@keyframes kenburns-bottom-right{0%{transform:scale(1) translate(0,0);transform-origin:84% 84%}100%{transform:scale(1.25) translate(20px,15px);transform-origin:right bottom}}
.kenburns-bottom-left{animation:kenburns-bottom-left 5s ease-out both}
@keyframes kenburns-bottom-left{0%{transform:scale(1) translate(0,0);transform-origin:16% 84%}100%{transform:scale(1.25) translate(-20px,15px);transform-origin:left bottom}}
.bg-pan-top{animation:bg-pan-top 8s both}
@keyframes bg-pan-top{0%{background-position:50% 100%}100%{background-position:50% 0}}
.bg-pan-left{animation:bg-pan-left 8s both}
@keyframes bg-pan-left{0%{background-position:100% 50%}100%{background-position:0 50%}}
.bg-pan-right{animation:bg-pan-right 8s both}
@keyframes bg-pan-right{0%{background-position:0 50%}100%{background-position:100% 50%}}

.color-change-2x{animation:color-change-2x 2s linear infinite alternate both}
@keyframes color-change-2x{0%{background:#19dcea}100%{background:#b22cff}}
.color-change-3x{animation:color-change-3x 4s linear infinite alternate both}
@keyframes color-change-3x{0%{background:#19dcea}50%{background:#b22cff}100%{background:#ea2222}}
.color-change-4x{animation:color-change-4x 6s linear infinite alternate both}
@keyframes color-change-4x{0%{background:#19dcea}33.3333%{background:#b22cff}66.666%{background:#ea2222}100%{background:#f5be10}}
.color-change-5x{animation:color-change-5x 8s linear infinite alternate both}
@keyframes color-change-5x{0%{background:#19dcea}25%{background:#b22cff}50%{background:#ea2222}75%{background:#f5be10}100%{background:#3bd80d}}