/* =Reset default browser CSS--------------------- */html, body, div, span, applet, object, iframe, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border: 0; font: inherit inherit 100% inherit; margin: 0; outline: 0; vertical-align: baseline;}
body{color:#000;}
#branding, #index-bottom{margin-left: auto;margin-right:auto; height:100%; zoom: 1; 
background: #FFF; /* IE6-9 */}
.purechat-poweredby-container{display:none;}
@font-face {font-family: 'pacifico';
 /*src: url('webfont.eot');*//* IE9 Compat Modes */src: /* url('webfont.eot?#iefix') format('embedded-opentype'), */ /* IE6-IE8 */ /* url('webfont.woff2') format('woff2'),*//* Super Modern Browsers *//*url('webfont.woff') format('woff'), */ /* Pretty Modern Browsers */ url('./../fonts/Pacifico.ttf')format('truetype'); /* Safari, Android, iOS *//*url('webfont.svg#svgFontName') format('svg'); */ /* Legacy iOS */}

@font-face {font-family: 'caviarb';
 /*src: url('webfont.eot');*//* IE9 Compat Modes */src: /* url('webfont.eot?#iefix') format('embedded-opentype'), */ /* IE6-IE8 */ /* url('webfont.woff2') format('woff2'),*//* Super Modern Browsers *//*url('webfont.woff') format('woff'), */ /* Pretty Modern Browsers */ url('./../fonts/AlegreyaSC-Regular.ttf')format('truetype'); /* Safari, Android, iOS *//*url('webfont.svg#svgFontName') format('svg'); */ /* Legacy iOS */}

@font-face {font-family: 'man';
	src: url('./../fonts/CaviarDreams.ttf') format('truetype');
}
@font-face {font-family: 'ralew';
	src: url('./../fonts/Raleway-Medium.ttf') format('truetype');
}
#underconstruction { width:100%;min-height:200px;margin-top:200px;margin-bottom:10px; text-align:center;}
.logon{width:96%;height:100px;padding:2%;}
.album{width:100%;height:150px;padding:0%;}
.wraper{width:50%;height:100px; }
#page{background-color:#1A1531;}
.bordertest{border:1px solid yellow;}
.font1 {font-family: "caviarb",serif;}
.font2 {font-family: "pacifico",comic;}
.font3 {font-family: "man", arial;}
.font5 {font-family: "ralew", arial;}
.font4 {font-family: arial, verdana;}
.plr0 {padding-left: 0px;padding-right: 0px;}
.putih {color: #FFF;}
.bodas {color: #FFF !important;}
.hideng{color: #000 !important;}
.bigfont{font-size:60px;color:white;margin-top:60px;}
.bigfontz{font-size:50px;line-height:1.1;}
.bigfonty{font-size:60px;line-height:1.1;}
.sedangfontz{font-size:30px;line-height:1.1;}
.sedangfonty{font-size:35px;line-height:1.1;}
.bigtit{font-size:60px;color:yellow;}
.text-sad{text-shadow: 0 0 5px #000000;}
.padtext{padding-left:100px;padding-right:100px;}
.red{color:red;}
.green{color:darkgreen;}
.orange{color:#FFB504;}
.kuning{color:yellow;}
a.orange:hover {color:yellow;text-decoration:none;}
.pattern {background: transparent url("./../../../images/4588928pattern.png") repeat scroll 0% 0%;padding: 0px;margin: 0px;height: 100%;width: 100%;}
.pattern2 {background: transparent url("./../../../images/4588928pattern.png") repeat scroll 0% 0%;padding: 0px;margin: 0px;height: 100%;width: 100%;}
.mask {background: transparent url("./../../../images/2409363mask.png") repeat scroll 0% 0%;padding: 0px;margin: 0px;height: 100%;width: 100%;}
.margin-0{margin-left:0px;margin-right:0px;}
.margin-t50{margin-top:50px;}
.navbar-default {position: absolute;width: 100%;border:none;}
/* .menul {background-color: rgba(0, 0, 0, 0.1);font-weight: bold;} */
.menul {background-color: transparent;font-weight: bold;}
.no-over{overflow:hidden;}
#tomb-2{position:absolute;top:5px;right:10px;}
.logoku {background-color: rgba(255, 255, 255, 0.6);box-shadow: 0px 0px 10px 10px rgba(255, 255, 255, 0.6);border-radius: 30px;margin-top: 0px;padding: 0px 6px;height: 40px;}
.navbar-nav {float: right;}
#myNavbar li {float: none;}
#access{-webkit-transition: background 0.5s ease-in-out;-moz-transition: background 0.5s ease-in-out;-ms-transition: background 0.5s ease-in-out;
-o-transition: background 0.5s ease-in-out;transition: background 0.5s ease-in-out;}
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {color: #FFFF00;background-color: #FFFF00;}
#myNavbar .navbar-nav > li > a {padding: 2px;width: 26px;font-size: 18px;color: #A0B7E3;border-radius: 50%;margin-top: 3px;}
.navbar-inverse {border: medium none;background-color: transparent;}
#myNavbar .navbar-nav > li > a {font-size: 18px;color: #A0B7E3;border-bottom:2px solid transparent;}
#myNavbar .navbar-nav > li > a:focus,#myNavbar .navbar-nav > li > a:hover{font-size: 18px;color: #FFFF00;border-bottom:2px solid transparent;}
#myNavbar {position: fixed;top: 200px;z-index: 500;right: 20px;}
.navbar-inverse {border: medium none;background-color: transparent;}
.navbar-inverse {border: medium none;background-color: transparent;}
#top-up {position: fixed;bottom: 0px;right: 0px;opacity: 0.7;z-index:100;}
#up-button-m {margin-right: 0px;margin-bottom: 3px;cursor: pointer;color: #FFF;text-shadow: 0 0 2px #000000;}
#up-button-m:hover {color: #3071A9;}
span.menu_hidden{border-bottom:2px solid transparent;}
span.menu_hidden:hover{border-color:#C6DC3B;}

.m0{margin:0px;}
.m20{margin-top:20px;}
.m10-{margin-left:: 10%;margin-right:10%;}
.m010{margin-top:0px;margin-bottom:10px;padding:0px;}
.m050{margin-bottom:50px;}
.p0{padding:0px;}
.pelor {border-radius: 30px;}
.bulet {-webkit-border-radius: 50% !important;border-radius: 50%!important;}
.ratakiri {text-align:left}
.ratakanan {text-align:right}
.buttoncust {padding: 2px 30px;background-color: rgba(0, 0, 122, 0.6);border: 1px solid #00F;}
.buttoncust:hover, .buttoncust:focus {background-color: rgba(0, 0, 122, 0.6);border: 1px solid transparent;-webkit-box-shadow: 1px 1px 15px 0 #421CFF;box-shadow: 1px 1px 10px 0 #421CFF;}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {color: #A63E3C;text-decoration: underline;background-color: transparent;}
.centre-container {background-position: center !important; margin: auto;}
.cycle-bg-image{background-position: center !important; }
.margin-2 {padding-bottom: 0px;padding-left: 0px;}
.margin1020 {margin :10px 20px;}
.pad1020 {padding :10px 20px;}
.nobord{border:none;}
.noshadow{-webkit-box-shadow: 0 0 0 0 #000;box-shadow: 0 0 0 0 #000;}
.img_hidden {display: none;width: 16px;}
.cursor{cursor: pointer;}
#section1 {color: #FFF;}
.section1 {color: #FFF;background-color: #1E88E5;height: 100vh;width: 100%;float: left;}
#section2 {color: #FFF;background-color: #673AB7;height: 100vh;width: 100%;float: left;}
#section3 {color: #FFF;background-color: #FF9800;height: 100vh;width: 100%;float: left;}
#section4 {color: #FFF;background-color: #AF0000;height: 100vh;width: 100%;float: left;}
#section5 {height: 100vh;width: 100%;float: left;background-position:fixed;}
.blue {background-color: #1E88E5;}
.jeruk {background-color: #FF9800;}
#footer {color: #FFF;background-color: #FFFFFF;height: 80vh;width: 100%;float: left;}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {color: #555;background-color: transparent;
}
.plr0 {padding-left: 0px;padding-right: 0px;}
.bo{font-weight:bold;}
.trans{background:none;background-color:transparent;}
h2.submenu{font-size:18px;padding:0px;margin:0px;}
.container-fluid{margin-right:0px; margin-left:0px;}
.icon-kecil img{height:20px;margin-top:-5px;}
.container-fluid{padding-right:0px;padding-left:0px;}
.row{margin-right:0px; margin-left:0px;}
.rot135{-ms-transform: rotate(135deg); /* IE 9 */-webkit-transform: rotate(135deg); /* Chrome, Safari, Opera */transform: rotate(135deg);color:#F2C500;}
#top-up{display:none;}
.span3 {width: 250px;}
.span3 {width: 350px;}
.wow { }
.animated {animation-duration: 1s;animation-fill-mode: both;}
#centerNavbar{font-size:40px;color:rgb(181, 170, 162);text-shadow: 0 0 1px #00007A;padding:0px;}
#page_hidden{position:relative;bottom:10px;}
a#centerNavbar:hover{text-shadow: 0 0 20px rgb(198, 220, 59);color:rgb(198, 220, 59);}
.bottom_place{position:absolute;width:100%;top:75%;}
.tengah{margin-left:auto;margin-right:auto;float:none;}
.judul{font-size:60px;margin-top:100px;margin-bottom:20px;color: #C6DC3B;text-shadow: 0 0 5px #00007A;}
.judul2{font-size:28px;text-shadow: 0 0 10px #000;padding:0px 20px;text-align:center;}
.t-customer{margin-top:20px;padding:0px 15px;}
.nohome{background-color:white;border-bottom:1px solid #F1F1F1;}
.nohome .putih{color:black;}
.nohome .logoku {margin-top:-10px;-webkit-box-shadow:none;box-shadow:none;}
.bg-white {background-color:white;}
.full{width:100%;height:100vh;}
.padlr10{padding:left:10px;padding-right:10px;}
.pad1020{padding:30px 10px;}
.bot10{padding-bottom:10px;}

/* =Global ----------------------------------------------- */
.border {border-bottom: 1px solid #b6b6b6;display: block; float: left; width: 100%;}
.page-title {color: #666; font-size: 10px; font-weight: 500; letter-spacing: 0.1em; line-height: 2.6em; margin: 0 0 2.6em; text-transform: uppercase;}
.page-title a {font-size: 14px; font-weight: bold; letter-spacing: 0; text-transform: none; COLOR: #666;} /* Images */
.center_title_page{width: 99%; height:35px;margin-bottom:5px; float: left; text-align: left; display: block;margin-top:10px;margin-left:20px;}
.halaman {font-family: "Arial Narrow", Arial; text-align: left;float:left;}
.halaman a {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #666; text-decoration: none;/* no underline */ color: #323371; /*backgroud */ background: #D6D6DB;
/* Show a solid color for older browsers */ background: -moz-linear-gradient(#D6D6DB, #9FA4B1); background: -o-linear-gradient(#D6D6DB, #9FA4B1); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#D6D6DB), to(#9FA4B1));/* older webkit syntax */ background: -webkit-linear-gradient(#D6D6DB, #9FA4B1);color: #323371; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; box-shadow: 3px 3px 2px grey;-webkit-transition-duration: 200ms; -webkit-transition-property: padding; -webkit-transition-timing-function: ease; -moz-transition-duration: 200ms; -moz-transition-property: padding; -moz-transition-timing-function: ease; -o-transition-duration: 200ms; -o-transition-property: padding; -o-transition-timing-function: ease;float:left;}
.halaman a:hover, div.halaman a:active {padding: 4px 5px; box-shadow: 3px 3px 2px grey; -moz-box-shadow: 3px 3px 2px grey; -webkit-box-shadow: 3px 3px 2px grey;float:left;}
.halaman .c {padding: 4px 5px; margin: 1px 2px 2px; border: 1px solid #666; text-decoration: none;
/* no underline */ 
color: #323371; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; box-shadow: 3px 3px 2px grey; font-weight: bold; background: #a7c7dc; /* Old browsers */
background: -moz-linear-gradient(top, #a7c7dc 0%, #85b2d3 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a7c7dc), color-stop(100%,#85b2d3)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #a7c7dc 0%,#85b2d3 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #a7c7dc 0%,#85b2d3 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #a7c7dc 0%,#85b2d3 100%); /* IE10+ */
background: linear-gradient(to bottom, #a7c7dc 0%,#85b2d3 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a7c7dc', endColorstr='#85b2d3',GradientType=0 ); /* IE6-9 */
float:left;}
.halaman d img {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #ff8e32; text-decoration: none;/* no underline */ color: #dd0077; -moz-border-radius: 4px; box-shadow: 3px 3px 2px grey; font-weight: bold;}
.halaman span.current {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #000099; font-weight: bold; background: #000099; color: #FFF;}
.halaman span.disabled {padding: 2px 5px 2px 5px; margin: 2px; border: 1px solid #EEE; color: #DDD;} /*CSS Klien*/
.halaman .btn {padding:3px 5px;}


@media (max-width: 768px) { 
.bottom_place{position:absolute;width:100%;top:80%;}
.ratakiri {text-align:center}
.ratakanan {text-align:center}
.judul{font-size:55px;margin-top:60px;margin-bottom:10px;}
#myNavbar{right:10px;}
.judul2{font-size:22px;padding:0px 20%;}
.t-customer{margin-top:10px;}
.bigfont{font-size:40px;color:white;margin-top:20px;}
.bigfontz{font-size:30px;line-height:1.1;}
.bigfonty{font-size:40px;line-height:1.1;}
.padtext{padding-left:5px;padding-right:5px;}
.album{width:100%;height:200px;padding:1% 2%;}
}
.caretz{margin-left:5px;margin-top:2px;float:right;}
/* animasi */
.menu_hidden{-webkit-transition: all 0.3s ease-in;-moz-transition: all 0.3s ease-in;-ms-transition: all 0.3s ease-in;-o-transition: all 0.3s ease-in;transition: all 0.3s ease-in;}
/* paralax */

.parallax {height: 100vh;overflow-x: hidden;overflow-y: auto;-webkit-perspective: 1.05px;perspective: 1.05px;}
.parallax__layer {position: absolute;top: 0;left: 0;right: 0;bottom: 0;}
.parallax__layer--base {-webkit-transform: translateZ(0);transform: translateZ(0);}
.parallax__layer--back {-webkit-transform: translateZ(-1px)scale(2);transform: translateZ(-1px)scale(2);}
.parallax__layer--back2 {-webkit-transform: translateZ(-2px)scale(3);transform: translateZ(-2px)scale(3);}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes bounceInUp {
0% {opacity: 0;-webkit-transform: translateY(2000px);transform: translateY(2000px);}
60% {opacity: 1;-webkit-transform: translateY(-30px);transform: translateY(-30px);}
80% {-webkit-transform: translateY(10px);transform: translateY(10px);}
100% {-webkit-transform: translateY(0);transform: translateY(0);}
}

@keyframes bounceInUp {
0% {opacity: 0;-webkit-transform: translateY(2000px);-ms-transform: translateY(2000px);transform: translateY(2000px);}
60% {opacity: 1;-webkit-transform: translateY(-30px);-ms-transform: translateY(-30px);transform: translateY(-30px);}
80% {-webkit-transform: translateY(10px);-ms-transform: translateY(10px);transform: translateY(10px);}
100% {-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0);}
}

.bounceInUp {-webkit-animation-name: bounceInUp;animation-name: bounceInUp;}
@-webkit-keyframes swing {
20% {-webkit-transform: rotate(15deg);transform: rotate(15deg);}
40% {-webkit-transform: rotate(-10deg);transform: rotate(-10deg);}
60% {-webkit-transform: rotate(5deg);transform: rotate(5deg);}
80% {-webkit-transform: rotate(-5deg);transform: rotate(-5deg);}
100% {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
}

@keyframes swing {
20% {-webkit-transform: rotate(15deg);-ms-transform: rotate(15deg);transform: rotate(15deg);}
40% {-webkit-transform: rotate(-10deg);-ms-transform: rotate(-10deg);transform: rotate(-10deg);}
60% {-webkit-transform: rotate(5deg);-ms-transform: rotate(5deg);transform: rotate(5deg);}
80% {-webkit-transform: rotate(-5deg);-ms-transform: rotate(-5deg);transform: rotate(-5deg);}
100% {-webkit-transform: rotate(0deg);-ms-transform: rotate(0deg);transform: rotate(0deg);}
}

.swing {-webkit-transform-origin: top center;
-ms-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}

@-webkit-keyframes pulse {0% {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}
50% {opacity: 0.9;-webkit-transform: scale(1.3);transform: scale(1.3);}
100% {opacity: 1;-webkit-transform: scale(1);transform: scale(1);}}

@keyframes pulse {0% {opacity: 1;-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
50% {opacity: 0.9;-webkit-transform: scale(1.3);-ms-transform: scale(1.3);transform: scale(1.3);}
100% {opacity: 1;-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}}

.pulse {-webkit-animation-name: pulse;
animation-name: pulse;
}

@-webkit-keyframes lightSpeedIn {
0% {-webkit-transform: translateX(100%) skewX(-30deg);transform: translateX(100%) skewX(-30deg);opacity: 0;}
60% {-webkit-transform: translateX(-20%) skewX(30deg);transform: translateX(-20%) skewX(30deg);opacity: 1;}
80% {-webkit-transform: translateX(0%) skewX(-15deg);transform: translateX(0%) skewX(-15deg);opacity: 1;}
100% {-webkit-transform: translateX(0%) skewX(0deg);transform: translateX(0%) skewX(0deg);opacity: 1;}
	}

@keyframes lightSpeedIn {
0% {-webkit-transform: translateX(100%) skewX(-30deg);-ms-transform: translateX(100%) skewX(-30deg);transform: translateX(100%) skewX(-30deg);opacity: 0;}
60% {-webkit-transform: translateX(-20%) skewX(30deg);-ms-transform: translateX(-20%) skewX(30deg);transform: translateX(-20%) skewX(30deg);opacity: 1;}
80% {-webkit-transform: translateX(0%) skewX(-15deg);-ms-transform: translateX(0%) skewX(-15deg);transform: translateX(0%) skewX(-15deg);opacity: 1;}
100% {-webkit-transform: translateX(0%) skewX(0deg);-ms-transform: translateX(0%) skewX(0deg);transform: translateX(0%) skewX(0deg);opacity: 1;}
}

.lightSpeedIn {-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes flipInX {
0% {-webkit-transform: perspective(400px) rotateX(90deg);transform: perspective(400px) rotateX(90deg);opacity: 0;}
40% {-webkit-transform: perspective(400px) rotateX(-10deg);transform: perspective(400px) rotateX(-10deg);}
70% {-webkit-transform: perspective(400px) rotateX(10deg);transform: perspective(400px) rotateX(10deg);}
100% {-webkit-transform: perspective(400px) rotateX(0deg);transform: perspective(400px) rotateX(0deg);opacity: 1;
}}

@keyframes flipInX {
0% {-webkit-transform: perspective(400px) rotateX(90deg);-ms-transform: perspective(400px) rotateX(90deg);transform: perspective(400px) rotateX(90deg);opacity: 0;}
40% {-webkit-transform: perspective(400px) rotateX(-10deg);-ms-transform: perspective(400px) rotateX(-10deg);transform: perspective(400px) rotateX(-10deg);}
70% {-webkit-transform: perspective(400px) rotateX(10deg);-ms-transform: perspective(400px) rotateX(10deg);transform: perspective(400px) rotateX(10deg);}
100% {-webkit-transform: perspective(400px) rotateX(0deg);-ms-transform: perspective(400px) rotateX(0deg);transform: perspective(400px) rotateX(0deg);opacity: 1;}
}

.flipInX {-webkit-backface-visibility: visible !important;
-ms-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes rollIn {
0% {opacity: 0;-webkit-transform: translateX(-100%) rotate(-120deg);transform: translateX(-100%) rotate(-120deg);}
100% {opacity: 1;-webkit-transform: translateX(0px) rotate(0deg);transform: translateX(0px) rotate(0deg);}
}

@keyframes rollIn {
0% {opacity: 0;-webkit-transform: translateX(-100%) rotate(-120deg);-ms-transform: translateX(-100%) rotate(-120deg);transform: translateX(-100%) rotate(-120deg);}
100% {opacity: 1;-webkit-transform: translateX(0px) rotate(0deg);-ms-transform: translateX(0px) rotate(0deg);transform: translateX(0px) rotate(0deg);}
}

.rollIn {-webkit-animation-name: rollIn;
animation-name: rollIn;
}

/* Pulse Shrink */
@-webkit-keyframes hvr-pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

@keyframes hvr-pulse-shrink {
  to {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }
}

.hvr-pulse-shrink {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
}
.hvr-pulse-shrink:hover, .hvr-pulse-shrink:focus, .hvr-pulse-shrink:active {
  -webkit-animation-name: hvr-pulse-shrink;
  animation-name: hvr-pulse-shrink;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  animation-direction: alternate;
}

/* Wobble Top */
@-webkit-keyframes hvr-wobble-top {
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

@keyframes hvr-wobble-top {
  16.65% {
    -webkit-transform: skew(-12deg);
    transform: skew(-12deg);
  }

  33.3% {
    -webkit-transform: skew(10deg);
    transform: skew(10deg);
  }

  49.95% {
    -webkit-transform: skew(-6deg);
    transform: skew(-6deg);
  }

  66.6% {
    -webkit-transform: skew(4deg);
    transform: skew(4deg);
  }

  83.25% {
    -webkit-transform: skew(-2deg);
    transform: skew(-2deg);
  }

  100% {
    -webkit-transform: skew(0);
    transform: skew(0);
  }
}

.hvr-wobble-top {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transform-origin: 0 100%;
  transform-origin: 0 100%;
}
.hvr-wobble-top:hover, .hvr-wobble-top:focus, .hvr-wobble-top:active {
  -webkit-animation-name: hvr-wobble-top;
  animation-name: hvr-wobble-top;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
/* Bounce In */
.hvr-bounce-in {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
.hvr-bounce-in:hover, .hvr-bounce-in:focus, .hvr-bounce-in:active {
  -webkit-transform: scale(1.2);
  transform: scale(1.2);
  -webkit-transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
  transition-timing-function: cubic-bezier(0.47, 2.02, 0.31, -0.36);
}