hr, img {
  border: 0
}
body, figure {
  margin: 0;
}
.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse, .pre-scrollable {
  max-height: 340px
}
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block
}
audio, canvas, progress, video {
  display: inline-block;
  vertical-align: baseline
}
audio:not([controls]) {
  display: none;
  height: 0
}
[hidden], template {
  display: none
}
a {
  background-color: transparent
}
a:active, a:hover {
  outline: 0
}
b, optgroup, strong {
  font-weight: 700
}
dfn {
  font-style: italic
}
h1 {
  margin: .67em 0
}
mark {
  background: #ff0;
  color: #000
}
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline
}
sup {
  top: -.5em
}
sub {
  bottom: -.25em
}
img {
  vertical-align: middle
}
svg:not(:root) {
  overflow: hidden
}
hr {
  box-sizing: content-box;
  height: 0
}
pre, textarea {
  overflow: auto
}
code, kbd, pre, samp {
  font-size: 1em
}
button, input, optgroup, select, textarea {
  color: inherit;
  font: inherit;
  margin: 0
}
.glyphicon, address {
  font-style: normal
}
button {
  overflow: visible
}
button, select {
  text-transform: none
}
button, html input[type=button], input[type=reset], input[type=submit] {
  -webkit-appearance: button;
  cursor: pointer
}
button[disabled], html input[disabled] {
  cursor: default
}
button::-moz-focus-inner, input::-moz-focus-inner {
border:0;
padding:0
}
input[type=checkbox], input[type=radio] {
  box-sizing: border-box;
  padding: 0
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
height:auto
}
input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
-webkit-appearance:none
}
table {
  border-collapse: collapse;
  border-spacing: 0
}
td, th {
  padding: 0
}

@media print {
blockquote, img, pre, tr {
  page-break-inside: avoid
}
*, :after, :before {
  background: 0 0!important;
  color: #000!important;
  box-shadow: none!important;
  text-shadow: none!important
}
a, a:visited {
  text-decoration: underline
}
a[href]:after {
  content: " (" attr(href) ")"
}
abbr[title]:after {
  content: " (" attr(title) ")"
}
a[href^="#"]:after, a[href^="javascript:"]:after {
  content: ""
}
blockquote, pre {
  border: 1px solid #999
}
thead {
  display: table-header-group
}
img {
  max-width: 100%!important
}
h2, h3, p {
  orphans: 3;
  widows: 3
}
h2, h3 {
  page-break-after: avoid
}
.navbar {
  display: none
}
.btn>.caret, .dropup>.btn>.caret {
  border-top-color: #000!important
}
.label {
  border: 1px solid #000
}
.table {
  border-collapse: collapse!important
}
.table td, .table th {
  background-color: #fff!important
}
.table-bordered td, .table-bordered th {
  border: 1px solid #ddd!important
}
}
.btn, .btn-danger.active, .btn-danger:active, .btn-default.active, .btn-default:active, .btn-info.active, .btn-info:active, .btn-primary.active, .btn-primary:active, .btn-warning.active, .btn-warning:active, .btn.active, .btn:active, .dropdown-menu>.disabled>a:focus, .dropdown-menu>.disabled>a:hover, .form-control, .navbar-toggle, .open>.dropdown-toggle.btn-danger, .open>.dropdown-toggle.btn-default, .open>.dropdown-toggle.btn-info, .open>.dropdown-toggle.btn-primary, .open>.dropdown-toggle.btn-warning {
  background-image: none
}
.img-thumbnail, body {
  background-color: #fff
}
@font-face {
  font-family: 'Glyphicons Halflings';
  src: url(../components/patternfly/dist/fonts/glyphicons-halflings-regular.eot.html);
  src: url(http://www.518hyz.vip/template/L12/components/patternfly/dist/fonts/glyphicons-halflings-regular.eot?) format('embedded-opentype'), url(../components/patternfly/dist/fonts/glyphicons-halflings-regular.woff2.html) format('woff2'), url(../components/patternfly/dist/fonts/glyphicons-halflings-regular.woff.html) format('woff'), url(../components/patternfly/dist/fonts/glyphicons-halflings-regular.ttf.html) format('truetype'), url(../components/patternfly/dist/fonts/glyphicons-halflings-regular.svg.html) format('svg')
}
.glyphicon {
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: 'Glyphicons Halflings';
  font-weight: 400;
  line-height: 1;
  -webkit-font-smoothing: antialiased
}
*, :after, :before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}
html {
  font-size: 10px;
  -webkit-tap-highlight-color: transparent
}
body {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  font-size: 12px;
  line-height: 1.66666667;
  color: #333
}
button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit
}
a {
  color: #0099d3;
  text-decoration: none
}
a:focus, a:hover {
  color: #00618a;
  text-decoration: underline
}
a:focus {
  outline: dotted thin;
  outline: -webkit-focus-ring-color auto 5px;
  outline-offset: -2px
}
.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img {
  display: block;
  max-width: 100%;
  height: auto
}
.img-rounded {
  border-radius: 1px
}
.img-thumbnail {
  padding: 4px;
  line-height: 1.66666667;
  border: 1px solid #ddd;
  border-radius: 1px;
  -webkit-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto
}
.img-circle {
  border-radius: 50%
}
hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border-top: 1px solid #eee
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0
}
.sr-only-focusable:active, .sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto
}
[role=button] {
  cursor: pointer
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit
}
.h1 .small, .h1 small, .h2 .small, .h2 small, .h3 .small, .h3 small, .h4 .small, .h4 small, .h5 .small, .h5 small, .h6 .small, .h6 small, h1 .small, h1 small, h2 .small, h2 small, h3 .small, h3 small, h4 .small, h4 small, h5 .small, h5 small, h6 .small, h6 small {
  font-weight: 400;
  line-height: 1;
  color: #999
}
.h1, .h2, .h3, h1, h2, h3 {
  margin-top: 20px;
  margin-bottom: 10px
}
.h1 .small, .h1 small, .h2 .small, .h2 small, .h3 .small, .h3 small, h1 .small, h1 small, h2 .small, h2 small, h3 .small, h3 small {
  font-size: 65%
}
.h4, .h5, .h6, h4, h5, h6 {
  margin-top: 10px;
  margin-bottom: 10px
}
.h4 .small, .h4 small, .h5 .small, .h5 small, .h6 .small, .h6 small, h4 .small, h4 small, h5 .small, h5 small, h6 .small, h6 small {
  font-size: 75%
}
.h1, h1 {
  font-size: 24px
}
.h2, h2 {
  font-size: 22px
}
.h3, h3 {
  font-size: 16px
}
.h4, h4 {
  font-size: 15px
}
.h5, h5 {
  font-size: 13px
}
.h6, h6 {
  font-size: 11px
}
p {
  margin: 0 0 10px
}
.lead {
  margin-bottom: 20px;
  font-size: 13px;
  font-weight: 300;
  line-height: 1.4
}
dt, kbd kbd {
  font-weight: 700
}
address, blockquote .small, blockquote footer, blockquote small, dd, dt, pre {
  line-height: 1.66666667
}

@media (min-width:768px) {
.lead {
  font-size: 18px
}
}
.small, small {
  font-size: 91%
}
.mark, mark {
  background-color: #fcf8e3;
  padding: .2em
}
.list-inline, .list-unstyled {
  padding-left: 0;
  list-style: none
}
dl, ol, ul {
  margin-top: 0
}
blockquote ol:last-child, blockquote p:last-child, blockquote ul:last-child, ol ol, ol ul, ul ol, ul ul {
  margin-bottom: 0
}
address, dl {
  margin-bottom: 20px
}
ol, ul {
  margin-bottom: 10px
}
.list-inline {
  margin-left: -5px
}
.list-inline>li {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px
}
dd {
  margin-left: 0
}

@media (min-width:992px) {
.dl-horizontal dt {
  float: left;
  width: 160px;
  clear: left;
  text-align: right;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap
}
.dl-horizontal dd {
  margin-left: 180px
}
}
abbr[data-original-title], abbr[title] {
  cursor: help;
  border-bottom: 1px dotted #999
}
.initialism {
  font-size: 90%;
  text-transform: uppercase
}
blockquote {
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 15px;
  border-left: 5px solid #eee
}
blockquote .small, blockquote footer, blockquote small {
  display: block;
  font-size: 80%;
  color: #999
}
legend, pre {
  display: block;
  color: #333
}
blockquote .small:before, blockquote footer:before, blockquote small:before {
  content: '\2014 \00A0'
}
.blockquote-reverse, blockquote.pull-right {
  padding-right: 15px;
  padding-left: 0;
  border-right: 5px solid #eee;
  border-left: 0;
  text-align: right
}
code, kbd {
  padding: 2px 4px;
  font-size: 90%;
  border-radius: 1px
}
caption, th {
  text-align: left
}
.blockquote-reverse .small:before, .blockquote-reverse footer:before, .blockquote-reverse small:before, blockquote.pull-right .small:before, blockquote.pull-right footer:before, blockquote.pull-right small:before {
  content: ''
}
.blockquote-reverse .small:after, .blockquote-reverse footer:after, .blockquote-reverse small:after, blockquote.pull-right .small:after, blockquote.pull-right footer:after, blockquote.pull-right small:after {
  content: '\00A0 \2014'
}
code, kbd, pre, samp {
  font-family: Menlo, Monaco, Consolas, monospace
}
code {
  color: #c7254e;
  background-color: #f9f2f4
}
kbd {
  color: #fff;
  background-color: #333;
  box-shadow: inset 0 -1px 0 rgba(0,0,0,.25)
}
kbd kbd {
  padding: 0;
  font-size: 100%;
  box-shadow: none
}
.checkbox label, .checkbox-inline, .radio label, .radio-inline {
  font-weight: 400;
  padding-left: 20px;
  cursor: pointer;
  margin-bottom: 0
}
pre {
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 11px;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #fcfcfc;
  border: 1px solid #ccc;
  border-radius: 1px
}
.container, .container-fluid {
  margin-right: auto;
  margin-left: auto
}
pre code {
  padding: 0;
  font-size: inherit;
  color: inherit;
  white-space: pre-wrap;
  border-radius: 0
}
.container, .container-fluid {
  padding-left: 20px;
  padding-right: 20px;
  max-width: 100%;
}
.pre-scrollable {
  overflow-y: scroll
}

@media (min-width:768px) {
.container {
  width: 760px
}
}

@media (min-width:992px) {
.container {
  width: 980px
}
}

@media (min-width:1200px) {
.container {
  width: 1180px
}
}
.row {
  margin-left: -20px;
  margin-right: -20px
}
fieldset, legend {
  padding: 0;
  border: 0
}
fieldset {
  margin: 0;
  min-width: 0
}
legend {
  width: 100%;
  margin-bottom: 20px;
  font-size: 18px;
  line-height: inherit;
  border-bottom: 1px solid #e5e5e5
}
label {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 5px
}
input[type=search] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-appearance: none
}
input[type=checkbox], input[type=radio] {
  margin: 4px 0 0;
  margin-top: 1px\9;
  line-height: normal
}
.form-control, output {
  font-size: 12px;
  line-height: 1.66666667;
  color: #333;
  display: block
}
input[type=file] {
  display: block
}
input[type=range] {
  display: block;
  width: 100%
}
select[multiple], select[size] {
  height: auto
}
input[type=file]:focus, input[type=checkbox]:focus, input[type=radio]:focus {
  outline: dotted thin;
  outline: -webkit-focus-ring-color auto 5px;
  outline-offset: -2px
}
output {
  padding-top: 3px
}

.form-group {
  margin-bottom: 15px
}
.checkbox, .radio {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px
}
.checkbox label, .radio label {
  min-height: 20px
}
.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
  position: absolute;
  margin-left: -20px;
  margin-top: 4px\9
}
.checkbox+.checkbox, .radio+.radio {
  margin-top: -5px
}
.checkbox-inline, .radio-inline {
  position: relative;
  display: inline-block;
  vertical-align: middle
}
.checkbox-inline+.checkbox-inline, .radio-inline+.radio-inline {
  margin-top: 0;
  margin-left: 10px
}
.checkbox-inline.disabled, .checkbox.disabled label, .radio-inline.disabled, .radio.disabled label, fieldset[disabled] .checkbox label, fieldset[disabled] .checkbox-inline, fieldset[disabled] .radio label, fieldset[disabled] .radio-inline, fieldset[disabled] input[type=checkbox], fieldset[disabled] input[type=radio], input[type=checkbox].disabled, input[type=checkbox][disabled], input[type=radio].disabled, input[type=radio][disabled] {
  cursor: not-allowed
}
.form-control-static {
  padding-top: 3px;
  padding-bottom: 3px;
  margin-bottom: 0;
  min-height: 32px
}
.form-control-static.input-lg, .form-control-static.input-sm {
  padding-left: 0;
  padding-right: 0
}
.form-group-sm .form-control, .input-sm {
  padding: 2px 6px;
  font-size: 11px;
  border-radius: 1px
}
.input-sm {
  height: 22px;
  line-height: 1.5
}
select.input-sm {
  height: 22px;
  line-height: 22px
}
select[multiple].input-sm, textarea.input-sm {
  height: auto
}

.btn, .dropdown-header, .dropdown-menu>li>a {
  line-height: 1.66666667;
  white-space: nowrap
}

#content {
  position: relative
}
.examples {
  margin: 20px 0
}
h1 {
  font-weight: 300;
  font-size: 24px
}
h2 {
  font-weight: 500;
  font-size: 18px
}
h3, h4, h5, h6 {
  font-weight: 600
}
h3 {
  font-size: 15px
}
h4 {
  font-size: 14px;
  line-height: 28px
}
h1, h2, h3 {
  line-height: 40px
}

.home .definition h2:after, .home .jumbotron .arrow:hover:before, .home .jumbotron .description:after {
  left: 50%;
  content: ''
}

.home {
  position: relative
}
.home .btn-group {
  background-image: -webkit-linear-gradient(top, #66effc 0, #2a8ec7 100%);
  background-image: -o-linear-gradient(top, #66effc 0, #2a8ec7 100%);
  background-image: linear-gradient(to bottom, #66effc 0, #2a8ec7 100%);
  background-repeat: repeat-x;
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff66effc', endColorstr='#ff2a8ec7', GradientType=0);
  margin: 0 0 10px;
  padding: 2px
}
.home .btn-group .btn {
  background: #060606;
  border: 0;
  font-size: 13px;
  font-weight: 100;
  padding: 6px 12px;
filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)
}
.home .definition, .home .get-involved {
  padding-bottom: 40px;
  text-align: center
}

@media (min-width:768px) {
.home .btn-group .btn {
  font-size: 16px;
  padding-left: 20px;
  padding-right: 20px
}
}
.home .btn-group .btn:hover {
  background: #202020
}
.home .btn-group .btn+.btn {
  margin-left: 2px
}
.home .definition .equals, .home .definition .plus {
  margin: 20px 0
}

@media (min-width:992px) {
.home .definition .equals, .home .definition .plus {
  margin-top: 70px
}
}
.home .definition h2 {
  color: #3bb1dc;
  line-height: 34px;
  margin-bottom: 80px;
  margin-top: 40px;
  position: relative
}
.home .definition h2:after {
  background: #aaa;
  bottom: -30px;
  height: 2px;
  margin: 0 0 0 -28px;
  position: absolute;
  width: 56px
}
.home .definition h3 {
  color: #3bb1dc;
  font-size: 21px;
  font-weight: 100;
  margin-bottom: 0
}
.home .get-involved {
  background: #010101;
  color: #e4e4e4
}

@media (min-width:992px) {
.home .get-involved {
}
}
.home .get-involved h2 {
  background: -webkit-linear-gradient(#5feffe, #208bc9);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #3bb1dc;
  margin-bottom: 40px;
  margin-top: 40px
}
.home h2 {
  font-size: 24px;
  font-weight: 100
}
.home .jumbotron {
  background-size: 40% auto, 40% auto, 60% auto, auto;
  color: #e4e4e4;
  margin: 0;
  padding-top: 100px;
  position: relative;
  text-align: center;
  box-sizing: border-box;
}

@media (min-width:1200px) {
.home .jumbotron {
  background-position: 0 0, 110% 0, 50% 100%;
  background-size: auto 100%, auto 100%, auto, auto
}
}

@media (min-width:768px) {
.home h2 {
  font-size: 30px
}
.home .jumbotron {
  background-size: 40% 100%, 40% 100%, 60% auto, auto;
  min-height: 100%;
  height: 100%
}
}
.home .jumbotron .alert {
  text-align: left
}
.home .jumbotron .arrow {
  bottom: 0;
  display: block;
  font-size: 40px;
  position: absolute;
  width: 100%
}
.home .jumbotron .arrow:hover:before {
  border: 20px solid rgba(255,255,255,.25);
  border-radius: 100px;
  height: 0;
  margin-left: -20px;
  position: absolute;
  top: 14px;
  width: 0
}
.home .jumbotron .content {
  display: table-cell;
  vertical-align: middle
}
.home .jumbotron .description {
  margin: 0 auto 25px;
  position: relative;
  /*width: 55%*/
}
.home .jumbotron .description:after {
  background: none;
  top: -24px;
  height: 2px;
  margin: 0 0 0 -28px;
  position: absolute;
  width: 56px
}
.home .jumbotron h1 {
  background: -webkit-linear-gradient(#5feffe, #208bc9);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #3bb1dc;
  font-size: 32px;
  font-weight: 100;
  line-height: 1.2;
  margin: 20px 0 30px;
}
.home .jumbotron img {
  max-width: 160px
}

@media (min-width:480px) {
.home .jumbotron h1 {
  font-size: 40px
}
.home .jumbotron img {
  max-width: 220px
}
}

@media (min-width:768px) {
.home .jumbotron h1 {
  font-size: 52px
}
.home .jumbotron img {
  max-width: 320px
}
}
.home .jumbotron .splash {
  display: table;
  width: 100%
}
.home .jumbotron .version {
  color: #bebebe;
  font-size: 11px
}
.home p {
  font-size: 16px;
  font-weight: 100
}

@media (min-width:768px) {
.home p {
  font-size: 18px
}
}

/*animated*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both
}
.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite
}
.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s
}
@-webkit-keyframes bounce {
0%, 100%, 20%, 53%, 80% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
40%, 43% {
-webkit-transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
-webkit-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
70% {
-webkit-transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
-webkit-transform:translate3d(0, -15px, 0);
transform:translate3d(0, -15px, 0)
}
90% {
-webkit-transform:translate3d(0, -4px, 0);
transform:translate3d(0, -4px, 0)
}
}
@keyframes bounce {
0%, 100%, 20%, 53%, 80% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
-webkit-transform:translate3d(0, 0, 0);
-ms-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
40%, 43% {
-webkit-transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
-webkit-transform:translate3d(0, -30px, 0);
-ms-transform:translate3d(0, -30px, 0);
transform:translate3d(0, -30px, 0)
}
70% {
-webkit-transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
transition-timing-function:cubic-bezier(0.755, .050, .855, .060);
-webkit-transform:translate3d(0, -15px, 0);
-ms-transform:translate3d(0, -15px, 0);
transform:translate3d(0, -15px, 0)
}
90% {
-webkit-transform:translate3d(0, -4px, 0);
-ms-transform:translate3d(0, -4px, 0);
transform:translate3d(0, -4px, 0)
}
}
.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  -ms-transform-origin: center bottom;
  transform-origin: center bottom
}
@-webkit-keyframes flash {
0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
@keyframes flash {
0%, 100%, 50% {
opacity:1
}
25%, 75% {
opacity:0
}
}
.flash {
  -webkit-animation-name: flash;
  animation-name: flash
}
@-webkit-keyframes pulse {
0% {
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
50% {
-webkit-transform:scale3d(1.05, 1.05, 1.05);
transform:scale3d(1.05, 1.05, 1.05)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
@keyframes pulse {
0% {
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
50% {
-webkit-transform:scale3d(1.05, 1.05, 1.05);
-ms-transform:scale3d(1.05, 1.05, 1.05);
transform:scale3d(1.05, 1.05, 1.05)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse
}
@-webkit-keyframes rubberBand {
0% {
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
30% {
-webkit-transform:scale3d(1.25, .75, 1);
transform:scale3d(1.25, .75, 1)
}
40% {
-webkit-transform:scale3d(0.75, 1.25, 1);
transform:scale3d(0.75, 1.25, 1)
}
50% {
-webkit-transform:scale3d(1.15, .85, 1);
transform:scale3d(1.15, .85, 1)
}
65% {
-webkit-transform:scale3d(.95, 1.05, 1);
transform:scale3d(.95, 1.05, 1)
}
75% {
-webkit-transform:scale3d(1.05, .95, 1);
transform:scale3d(1.05, .95, 1)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
@keyframes rubberBand {
0% {
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
30% {
-webkit-transform:scale3d(1.25, .75, 1);
-ms-transform:scale3d(1.25, .75, 1);
transform:scale3d(1.25, .75, 1)
}
40% {
-webkit-transform:scale3d(0.75, 1.25, 1);
-ms-transform:scale3d(0.75, 1.25, 1);
transform:scale3d(0.75, 1.25, 1)
}
50% {
-webkit-transform:scale3d(1.15, .85, 1);
-ms-transform:scale3d(1.15, .85, 1);
transform:scale3d(1.15, .85, 1)
}
65% {
-webkit-transform:scale3d(.95, 1.05, 1);
-ms-transform:scale3d(.95, 1.05, 1);
transform:scale3d(.95, 1.05, 1)
}
75% {
-webkit-transform:scale3d(1.05, .95, 1);
-ms-transform:scale3d(1.05, .95, 1);
transform:scale3d(1.05, .95, 1)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
20%, 40%, 60%, 80% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
}
@keyframes shake {
0%, 100% {
-webkit-transform:translate3d(0, 0, 0);
-ms-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform:translate3d(-10px, 0, 0);
-ms-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
20%, 40%, 60%, 80% {
-webkit-transform:translate3d(10px, 0, 0);
-ms-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
}
.shake {
  -webkit-animation-name: shake;
  animation-name: shake
}
@-webkit-keyframes swing {
20% {
-webkit-transform:rotate3d(0, 0, 1, 15deg);
transform:rotate3d(0, 0, 1, 15deg)
}
40% {
-webkit-transform:rotate3d(0, 0, 1, -10deg);
transform:rotate3d(0, 0, 1, -10deg)
}
60% {
-webkit-transform:rotate3d(0, 0, 1, 5deg);
transform:rotate3d(0, 0, 1, 5deg)
}
80% {
-webkit-transform:rotate3d(0, 0, 1, -5deg);
transform:rotate3d(0, 0, 1, -5deg)
}
100% {
-webkit-transform:rotate3d(0, 0, 1, 0deg);
transform:rotate3d(0, 0, 1, 0deg)
}
}
@keyframes swing {
20% {
-webkit-transform:rotate3d(0, 0, 1, 15deg);
-ms-transform:rotate3d(0, 0, 1, 15deg);
transform:rotate3d(0, 0, 1, 15deg)
}
40% {
-webkit-transform:rotate3d(0, 0, 1, -10deg);
-ms-transform:rotate3d(0, 0, 1, -10deg);
transform:rotate3d(0, 0, 1, -10deg)
}
60% {
-webkit-transform:rotate3d(0, 0, 1, 5deg);
-ms-transform:rotate3d(0, 0, 1, 5deg);
transform:rotate3d(0, 0, 1, 5deg)
}
80% {
-webkit-transform:rotate3d(0, 0, 1, -5deg);
-ms-transform:rotate3d(0, 0, 1, -5deg);
transform:rotate3d(0, 0, 1, -5deg)
}
100% {
-webkit-transform:rotate3d(0, 0, 1, 0deg);
-ms-transform:rotate3d(0, 0, 1, 0deg);
transform:rotate3d(0, 0, 1, 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 tada {
0% {
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
@keyframes tada {
0% {
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
10%, 20% {
-webkit-transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
-ms-transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform:scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
}
30%, 50%, 70%, 90% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
-ms-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
}
40%, 60%, 80% {
-webkit-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
-ms-transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform:scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
}
100% {
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
.tada {
  -webkit-animation-name: tada;
  animation-name: tada
}
@-webkit-keyframes wobble {
0% {
-webkit-transform:none;
transform:none
}
15% {
-webkit-transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
}
30% {
-webkit-transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
}
45% {
-webkit-transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
}
60% {
-webkit-transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
}
75% {
-webkit-transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
}
100% {
-webkit-transform:none;
transform:none
}
}
@keyframes wobble {
0% {
-webkit-transform:none;
-ms-transform:none;
transform:none
}
15% {
-webkit-transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
-ms-transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform:translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
}
30% {
-webkit-transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
-ms-transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform:translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
}
45% {
-webkit-transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
-ms-transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform:translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
}
60% {
-webkit-transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
-ms-transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform:translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
}
75% {
-webkit-transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
-ms-transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform:translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
}
100% {
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble
}
@-webkit-keyframes bounceIn {
0%, 100%, 20%, 40%, 60%, 80% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
20% {
-webkit-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
40% {
-webkit-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
60% {
opacity:1;
-webkit-transform:scale3d(1.03, 1.03, 1.03);
transform:scale3d(1.03, 1.03, 1.03)
}
80% {
-webkit-transform:scale3d(.97, .97, .97);
transform:scale3d(.97, .97, .97)
}
100% {
opacity:1;
-webkit-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
@keyframes bounceIn {
0%, 100%, 20%, 40%, 60%, 80% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
-ms-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
20% {
-webkit-transform:scale3d(1.1, 1.1, 1.1);
-ms-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
40% {
-webkit-transform:scale3d(.9, .9, .9);
-ms-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
60% {
opacity:1;
-webkit-transform:scale3d(1.03, 1.03, 1.03);
-ms-transform:scale3d(1.03, 1.03, 1.03);
transform:scale3d(1.03, 1.03, 1.03)
}
80% {
-webkit-transform:scale3d(.97, .97, .97);
-ms-transform:scale3d(.97, .97, .97);
transform:scale3d(.97, .97, .97)
}
100% {
opacity:1;
-webkit-transform:scale3d(1, 1, 1);
-ms-transform:scale3d(1, 1, 1);
transform:scale3d(1, 1, 1)
}
}
.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-animation-duration: .75s;
  animation-duration: .75s
}
@-webkit-keyframes bounceInDown {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, -3000px, 0);
transform:translate3d(0, -3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, 25px, 0);
transform:translate3d(0, 25px, 0)
}
75% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
90% {
-webkit-transform:translate3d(0, 5px, 0);
transform:translate3d(0, 5px, 0)
}
100% {
-webkit-transform:none;
transform:none
}
}
@keyframes bounceInDown {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, -3000px, 0);
-ms-transform:translate3d(0, -3000px, 0);
transform:translate3d(0, -3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, 25px, 0);
-ms-transform:translate3d(0, 25px, 0);
transform:translate3d(0, 25px, 0)
}
75% {
-webkit-transform:translate3d(0, -10px, 0);
-ms-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
90% {
-webkit-transform:translate3d(0, 5px, 0);
-ms-transform:translate3d(0, 5px, 0);
transform:translate3d(0, 5px, 0)
}
100% {
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown
}
@-webkit-keyframes bounceInLeft {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(-3000px, 0, 0);
transform:translate3d(-3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(25px, 0, 0);
transform:translate3d(25px, 0, 0)
}
75% {
-webkit-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
90% {
-webkit-transform:translate3d(5px, 0, 0);
transform:translate3d(5px, 0, 0)
}
100% {
-webkit-transform:none;
transform:none
}
}
@keyframes bounceInLeft {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(-3000px, 0, 0);
-ms-transform:translate3d(-3000px, 0, 0);
transform:translate3d(-3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(25px, 0, 0);
-ms-transform:translate3d(25px, 0, 0);
transform:translate3d(25px, 0, 0)
}
75% {
-webkit-transform:translate3d(-10px, 0, 0);
-ms-transform:translate3d(-10px, 0, 0);
transform:translate3d(-10px, 0, 0)
}
90% {
-webkit-transform:translate3d(5px, 0, 0);
-ms-transform:translate3d(5px, 0, 0);
transform:translate3d(5px, 0, 0)
}
100% {
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft
}
@-webkit-keyframes bounceInRight {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(3000px, 0, 0);
transform:translate3d(3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(-25px, 0, 0);
transform:translate3d(-25px, 0, 0)
}
75% {
-webkit-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
90% {
-webkit-transform:translate3d(-5px, 0, 0);
transform:translate3d(-5px, 0, 0)
}
100% {
-webkit-transform:none;
transform:none
}
}
@keyframes bounceInRight {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(3000px, 0, 0);
-ms-transform:translate3d(3000px, 0, 0);
transform:translate3d(3000px, 0, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(-25px, 0, 0);
-ms-transform:translate3d(-25px, 0, 0);
transform:translate3d(-25px, 0, 0)
}
75% {
-webkit-transform:translate3d(10px, 0, 0);
-ms-transform:translate3d(10px, 0, 0);
transform:translate3d(10px, 0, 0)
}
90% {
-webkit-transform:translate3d(-5px, 0, 0);
-ms-transform:translate3d(-5px, 0, 0);
transform:translate3d(-5px, 0, 0)
}
100% {
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight
}
@-webkit-keyframes bounceInUp {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, 3000px, 0);
transform:translate3d(0, 3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
75% {
-webkit-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
90% {
-webkit-transform:translate3d(0, -5px, 0);
transform:translate3d(0, -5px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
@keyframes bounceInUp {
0%, 100%, 60%, 75%, 90% {
-webkit-transition-timing-function:cubic-bezier(0.215, .61, .355, 1);
transition-timing-function:cubic-bezier(0.215, .61, .355, 1)
}
0% {
opacity:0;
-webkit-transform:translate3d(0, 3000px, 0);
-ms-transform:translate3d(0, 3000px, 0);
transform:translate3d(0, 3000px, 0)
}
60% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
-ms-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
75% {
-webkit-transform:translate3d(0, 10px, 0);
-ms-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
90% {
-webkit-transform:translate3d(0, -5px, 0);
-ms-transform:translate3d(0, -5px, 0);
transform:translate3d(0, -5px, 0)
}
100% {
-webkit-transform:translate3d(0, 0, 0);
-ms-transform:translate3d(0, 0, 0);
transform:translate3d(0, 0, 0)
}
}
.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp
}
@-webkit-keyframes bounceOut {
20% {
-webkit-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
50%, 55% {
opacity:1;
-webkit-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
100% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
}
@keyframes bounceOut {
20% {
-webkit-transform:scale3d(.9, .9, .9);
-ms-transform:scale3d(.9, .9, .9);
transform:scale3d(.9, .9, .9)
}
50%, 55% {
opacity:1;
-webkit-transform:scale3d(1.1, 1.1, 1.1);
-ms-transform:scale3d(1.1, 1.1, 1.1);
transform:scale3d(1.1, 1.1, 1.1)
}
100% {
opacity:0;
-webkit-transform:scale3d(.3, .3, .3);
-ms-transform:scale3d(.3, .3, .3);
transform:scale3d(.3, .3, .3)
}
}
.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
  -webkit-animation-duration: .75s;
  animation-duration: .75s
}
@-webkit-keyframes bounceOutDown {
20% {
-webkit-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(0, 2000px, 0);
transform:translate3d(0, 2000px, 0)
}
}
@keyframes bounceOutDown {
20% {
-webkit-transform:translate3d(0, 10px, 0);
-ms-transform:translate3d(0, 10px, 0);
transform:translate3d(0, 10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, -20px, 0);
-ms-transform:translate3d(0, -20px, 0);
transform:translate3d(0, -20px, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(0, 2000px, 0);
-ms-transform:translate3d(0, 2000px, 0);
transform:translate3d(0, 2000px, 0)
}
}
.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown
}
@-webkit-keyframes bounceOutLeft {
20% {
opacity:1;
-webkit-transform:translate3d(20px, 0, 0);
transform:translate3d(20px, 0, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(-2000px, 0, 0);
transform:translate3d(-2000px, 0, 0)
}
}
@keyframes bounceOutLeft {
20% {
opacity:1;
-webkit-transform:translate3d(20px, 0, 0);
-ms-transform:translate3d(20px, 0, 0);
transform:translate3d(20px, 0, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(-2000px, 0, 0);
-ms-transform:translate3d(-2000px, 0, 0);
transform:translate3d(-2000px, 0, 0)
}
}
.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft
}
@-webkit-keyframes bounceOutRight {
20% {
opacity:1;
-webkit-transform:translate3d(-20px, 0, 0);
transform:translate3d(-20px, 0, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(2000px, 0, 0);
transform:translate3d(2000px, 0, 0)
}
}
@keyframes bounceOutRight {
20% {
opacity:1;
-webkit-transform:translate3d(-20px, 0, 0);
-ms-transform:translate3d(-20px, 0, 0);
transform:translate3d(-20px, 0, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(2000px, 0, 0);
-ms-transform:translate3d(2000px, 0, 0);
transform:translate3d(2000px, 0, 0)
}
}
.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight
}
@-webkit-keyframes bounceOutUp {
20% {
-webkit-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, 20px, 0);
transform:translate3d(0, 20px, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(0, -2000px, 0);
transform:translate3d(0, -2000px, 0)
}
}
@keyframes bounceOutUp {
20% {
-webkit-transform:translate3d(0, -10px, 0);
-ms-transform:translate3d(0, -10px, 0);
transform:translate3d(0, -10px, 0)
}
40%, 45% {
opacity:1;
-webkit-transform:translate3d(0, 20px, 0);
-ms-transform:translate3d(0, 20px, 0);
transform:translate3d(0, 20px, 0)
}
100% {
opacity:0;
-webkit-transform:translate3d(0, -2000px, 0);
-ms-transform:translate3d(0, -2000px, 0);
transform:translate3d(0, -2000px, 0)
}
}
.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp
}
@-webkit-keyframes fadeIn {
0% {
opacity:0
}
100% {
opacity:1
}
}
@keyframes fadeIn {
0% {
opacity:0
}
100% {
opacity:1
}
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn
}
@-webkit-keyframes fadeInDown {
0% {
opacity:0;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
}
/*index*/
html, body {
  width: 100%;
}
#main article {
  border-bottom: 0
}
body {
  font: 18px PingFang SC, Lantinghei SC, Microsoft Yahei, Hiragino Sans GB, Microsoft Sans Serif, WenQuanYi Micro Hei, sans;
  background-color: #07040e
}
#canvas {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  cursor: none;
  max-width: 100%;
}
.content {
  position: absolute;
  z-index: 11;
  right: 0;
  left: 0;
  top: 0;
}
.splash {
  position: relative
}
img#qq {
  max-width: 220px;
  /*max-height:100px;*/
  background-size: cover;
  border-radius: 200px;
  box-shadow: 0 0 40px rgba(63,81,181,0.72);
  border: 3px solid #00a0ff;
  opacity: 1;
  margin: 0 auto;
  margin-top: 20px;
  margin-bottom: 20px;
  transition: all 1.0s
}
#qq:hover {
  box-shadow: 0 0 10px #fff;
  -webkit-box-shadow: 0 0 19px #fff;
  transform: rotate(360deg);
  -ms-transform: rotate(360deg);
  -moz-transform: rotate(360deg);
  -webkit-transform: rotate(360deg);
  -o-transform: rotate(360deg);
filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3)
}
.content a {
  margin-top: 6px;
  margin-right: 1em
}
.copyright {
  font-size: 13px;
  padding-bottom: 18px;
  margin-top: 100px;
}