a,
body,
div,
h1,
html,
li,
span,
ul {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ul {
  list-style: none;
}

a {
  display: block;
  text-decoration: none;
}

.outline_hidden {
  text-align: -99999px;
  font-size: 0;
}

button:focus {
  outline: none !important;
}

body {
  background-color: #060009;
  font-family: "微軟正黑體", Nanum Barun Gothic, sans-serif;
  min-width: 1200px;
}

body,
html {
}

img {
  max-width: 100%;
  height: auto;
}

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

.mission li:after {
  clear: both;
}

.cls_nav {
  position: absolute;
  top: 17px;
  right: 386px;
  font-size: 16px;
}

.cls_nav li {
  float: left;
  margin-left: 20px;
}

.cls_nav li a {
  color: #e8e8e8;
}

.cls_nav li a:hover {
  color: #878787;
  text-decoration: none;
}

.sidebar {
  position: fixed;
  top: 70px;
  right: 10px;
  z-index: 999;
}

.sidebar ul li {
  display: block;
  margin: 0 0 10px 0;
}

.sidebar ul > li > a {
  display: block;
  height: 181px;
  width: 186px;
  text-indent: -9999px;
  overflow: hidden;
  background: url(../img/sidebar.png) no-repeat 0 0;
}

.sidebar ul > li > a:hover {
  background: url(../img/sidebar_hover.png) no-repeat 0 0;
}

.sidebar ul > li:nth-child(1) a {
  background-position-y: -181px;
}

.sidebar ul > li:nth-child(3) a {
  background-position-y: -362px;
}

.sidebar ul > li:nth-child(4) a {
  background-position-y: -543px;
}

.sidebar ul > li:nth-child(5) a {
  display: none;
}

.sidebar li.d-none,
.sidebar ul > li:nth-child(4) {
  display: none;
}

.home {
  position: absolute;
  top: 3px;
  left: 52px;
  z-index: 999;
  display: block;
}

.youtube {
  display: block;
  position: absolute;
  top: 12px;
  right: 245px;
}

.fb {
  position: absolute;
  top: 12px;
  right: 30px;
}

#particles-js {
  position: absolute;
  width: 100%;
  height: 951px;
  top: 0;
  left: 0;
  z-index: 999;
  pointer-events: none;
  z-index: 99;
}

.wrap {
  position: relative;
  min-width: 1200px;
  overflow: hidden;
  background: url(../img/bg.jpg) no-repeat 50% 0;
  height: 100%;
  margin: 50px 0 0;
}

/* .glitch {
	-webkit-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
	-webkit-animation-name: blinking;
	animation-name: blinking;
} */

.wrap .active[class^="noise"] {
  -webkit-animation: effect 1.5s infinite cubic-bezier(0.42, 0, 0.03, 0.99);
  animation: effect 1.5s infinite cubic-bezier(0.42, 0, 0.03, 0.99);
}

.l {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.r {
  position: absolute;
  top: 0;
  right: 0;
  opacity: 0;
}

[class^="noise"] {
  position: absolute;
  left: 50%;
  right: 50%;
  top: 0;
  margin: auto;
  z-index: 5;
}

[class^="noise"].noise1 {
  width: 408px;
  height: 22px;
  background: url("../img/glitch.png") -279px 0px;
}

[class^="noise"].noise2 {
  width: 269px;
  height: 33px;
  background: url("../img/glitch.png") 0px -63px;
}

[class^="noise"].noise3 {
  width: 162px;
  height: 18px;
  background: url("../img/glitch.png") -496px -63px;
}

[class^="noise"].noise4 {
  width: 251px;
  height: 15px;
  background: url("../img/glitch.png") -279px -32px;
}

[class^="noise"].noise5 {
  width: 207px;
  height: 33px;
  background: url("../img/glitch.png") -279px -63px;
}

[class^="noise"].noise6 {
  width: 59px;
  height: 33px;
  background: url("../img/glitch.png") -77px -106px;
}

[class^="noise"].noise7 {
  width: 269px;
  height: 53px;
  background: url("../img/glitch.png") 0px 0px;
}

.wrap .noise1.l {
  margin-left: -774px;
  margin-top: 753px;
}

.wrap .noise2 {
  margin-right: -751px;
  margin-top: 799px;
}

.wrap .noise3 {
  margin-right: -532px;
  margin-top: 916px;
}

.wrap .noise4 {
  margin-left: -438px;
  margin-top: 957px;
}

.wrap .noise5 {
  margin-left: -580px;
  margin-top: 400px;
}

.wrap .noise1.r {
  margin-right: -700px;
  margin-top: 200px;
}

.header {
  position: relative;
  background: transparent;
  z-index: 1;
}

.header .title {
  position: absolute;
  background: transparent url(../img/tit.png) no-repeat 0 0;
  width: 863px;
  height: 243px;
  left: 50%;
  margin-left: -602px;
  top: -57px;
}

.header .home {
  position: absolute;
  left: 50%;
  margin-left: 475px;
  background: transparent url(../img/btn_home.png) no-repeat 0 0;
}

.wrap {
}

.main .header {
  margin: 50px 0 0;
  padding: 873px 0 0;
  /* background: url(../img/head_bg.jpg) no-repeat 50% 0;
	background-size: cover;
	z-index: -1;
	-webkit-animation: opacity 6s infinite cubic-bezier(0.42, 0, 0.03, 0.99);
	animation: opacity 6s infinite cubic-bezier(0.42, 0, 0.03, 0.99); */
}

.main .header .home {
  top: 35px;
  width: 125px;
  height: 28px;
  background-position: 0 0px;
}

.main .header .home:hover {
  filter: drop-shadow(0px 0px 5px rgb(255, 255, 255));
}

#scene {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  z-index: 7;
}

.gunBox {
  width: 100%;
  height: 100%;
}

.main .gun1 {
  width: 478px;
  height: 355px;
  margin-left: 150px;
  top: 22%;
  background: transparent url(../img/gun1.png) no-repeat 0 0;
}

/* .main .gun2 {
	width: 452px;
	height: 362px;
	left: 25%;
	top: 48%;
	background: transparent url(../img/gun2.png) no-repeat 0 0;
}

.main .gun3 {
	width: 446px;
	height: 348px;
	left: 55%;
	top: 63%;
	background: transparent url(../img/gun3.png) no-repeat 0 0;
} */

.main .gunBox .gun {
  position: absolute;
  z-index: 9;
  background-size: contain;
  left: 50%;
}

@media (max-width: 1200px) {
  .main .gun3 {
    top: 50%;
  }

  .main .gun2 {
    top: 46%;
    left: 29%;
  }

  .main .gun1 {
    top: 26%;
    left: 0%;
  }
}

.main .sprayBox {
  height: 100%;
}

/* .main .spray1 {
	background: transparent url(../img/spray1.png) no-repeat 0 0;
}

.main .spray2 {
	background: transparent url(../img/spray2.png) no-repeat 0 0;
}

.main .spray3 {
	background: transparent url(../img/spray3.png) no-repeat 0 0;
} */

.main .spray4 {
  background: transparent url(../img/wm.png) no-repeat 0 0;
  width: 888px;
  height: 809px;
  bottom: 106px;
  margin-left: -288px;
}

.main .sprayBox .spray {
  position: absolute;
  z-index: 9;
  left: 50%;
  background-size: contain;
  opacity: 0;
  animation: slideInUp 0.8s ease-in-out 0s 1 forwards;
}

@keyframes slideInUp {
  0% {
    opacity: 0;
    transform: translate(0px, 100px);
  }

  100% {
    opacity: 1;
    transform: translate(0px, -0px);
  }
}

.sub_tit {
  background: transparent url(../img/sub_title.png) no-repeat 0 0;
  width: 1014px;
  height: 48px;
  margin: -160px auto 0;
  left: 0;
  right: 0;
  position: absolute;
  z-index: 10;
}

.sub_tit h1 {
  text-indent: -999999px;
}

.section1 {
  position: relative;
  width: 100%;
}

.notice {
  position: relative;
  background: transparent url(../img/notice.png) no-repeat 0 0;
  background-size: contain;
  width: 838px;
  height: 623px;
  margin: 0 auto;
}

.login,
.logout {
  padding: 50px 0;
  text-align: center;
  position: relative;
}

.login .loginBtn,
.logout .logoutBtn,
.serialBtn,
.weaponBtn {
  display: block;
  width: 218px;
  height: 57px;
  margin: 20px auto 0;
  background: transparent url(../img/btn.png) no-repeat 0 0;
  text-indent: -99999px;
	filter: drop-shadow(0 3px 6px rgba(0,0,0,0.75));
}

.login .loginBtn {
}

.logout .logoutInfo {
  font-size: 18px;
  color: #fee559;
  display: block;
  background: url(../img/logout-bg.png) no-repeat 0 0;
  width: 430px;
  height: 63px;
	padding: 0 129px 0 63px;
  margin: 0 auto;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
	position: relative;
	line-height: 64px;
}

.logout .logoutInfo span {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 60px;
  display: block;
  color: #fff;
	font-weight: 700;
}

.login .loginBtn:hover,
.logout .logoutBtn:hover,
.serialBtn:hover,
.weaponBtn:hover {
  background: transparent url(../img/btn_hover.png) no-repeat 0 0;
}

.logout .logoutBtn,
.logout .logoutBtn:hover {
  background-position-y: -57px;
}

.main .navbar {
  text-align: center;
  z-index: 99;
  margin-bottom: 0px;
  border: none;
  border-radius: 0;
  z-index: 0;
}

.main .nav {
  display: inline-block;
  margin: 50px auto;
}

.main .nav li {
  float: left;
  display: block;
  margin: 0 20px;
}

/* .main .nav li a, */
.sidebar ul > li > a,
.login a,
.logout a,
.serialBtn,
.weaponBtn,
.serialNum .copyBtn {
  -moz-transition: all 0.25s ease-in-out;
  -webkit-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}

.main .nav li a {
  display: inline-block;
  position: relative;
  text-indent: -99999px;
  background: transparent url(../img/navbar.png) no-repeat 0 0;
  width: 257px;
  height: 108px;
  padding: 0;
	filter: drop-shadow(0 3px 6px rgba(0,0,0,0.75));
}

.main .nav li a:hover {
  background: transparent url(../img/navbar_hover.png) no-repeat 0 0;
}

.main .nav li.on a {
	background: transparent url(../img/navbar_active.png) no-repeat 0 0;
}

.main .nav li:nth-child(2) a,
.main .nav li.on:nth-child(2) a {
  background-position-y: -108px;
}

.main .nav li:nth-child(3) a,
.main .nav li.on:nth-child(3) a {
  background-position-y: 100%;
}

.content {
  position: relative;
  text-align: center;
  padding: 0 0 150px;
}

.content > [id*="con"] {
  height: 100%;
}

.txt_y {
  display: none;
  text-indent: -99999px;
}

.txt_b {
  color: #bae4fb;
}

.content #con1, .content #con2, .content #con3 {
  position: relative;
	padding: 38px 0 0;
}
.content #con1::before,
.content #con3::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin: 0 auto;
	background: url(../img/tit_bg.png) no-repeat 0 0;
	width: 1019px;
	height: 247px;
}
.content #con1 .title {
  background: transparent url(../img/tit-1.png) no-repeat 0 0;
  width: 452px;
  height: 41px;
  margin: 0 auto 35px;
  text-indent: -99999px;
}

.content .date_wrapper {
  background: transparent url(../img/date_info-1.png) no-repeat 0 0;
  text-indent: -99999px;
  margin: 0 auto;
}

.content #con1 .date_wrapper {
  width: 549px;
  height: 87px;
}

.content #con1 div:nth-child(6).date_wrapper {
  display: none;
}

.content .remark {
  text-align: left;
  width: 1200px;
	margin: 0 auto;
	position: relative;
}
.content #con1 .remark::before {
	content: '';
	position: absolute;
	right: -37px;
	bottom: -47px;
	background: url(../img/gm-2.png) no-repeat 0 0;
	width: 237px;
	height: 420px;
}
.content .date_wrapper p {
  position: relative;
  text-indent: -99999px;
}

.content .date_wrapper p.attention {
  text-indent: -99999px;
}
.content #con2::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	margin: 0 auto;
	background: url(../img/tit_bg-2.png) no-repeat 0 0;
	width: 1019px;
	height: 377px;
}
.content #con2 .date_wrapper {
  width: 767px;
  height: 208px;
  background: transparent url(../img/date_info-2.png) no-repeat 0 0;
}

.content #con3 .date_wrapper {
  width: 915px;
  height: 87px;
  background: transparent url(../img/date_info-3.png) no-repeat 0 0;
}

.content #con2 {
  height: 100%;
  /* padding: 0 0 150px; */
}

.content #con2 .title {
  background: transparent url(../img/tit-2.png) no-repeat 0 0;
  width: 286px;
  height: 41px;
  margin: 0 auto 35px;
  text-indent: -99999px;
}

.content #con2 .title:after,
.content #con2 .title:before {
  background-position-y: -38px;
}

.content #con2 .date {
  background: transparent url(../img/date_info-2.png) no-repeat 0 0;
  width: 767px;
  height: 208px;
  margin: 0 auto;
  text-indent: -99999px;
}

.content #con3 {
  position: relative;
}

.content #con3 .remark::before {
	content: '';
	position: absolute;
	right: -88px;
	bottom: -47px;
	background: url(../img/gm-3.png) no-repeat 0 0;
	width: 287px;
	height: 388px;
}

.content #con3 .title {
  background: transparent url(../img/tit-3.png) no-repeat 0 0;
  width: 452px;
  height: 41px;
  margin: 0 auto 35px;
  text-indent: -99999px;
}

.content #con3 .title:after,
.content #con3 .title:before {
  background-position-y: -76px;
}

.content #con3 .date {
  background: transparent url(../img/date_info-3.png) no-repeat 0 0;
  width: 915px;
  height: 87px;
  margin: 0 auto;
  text-indent: -99999px;
}

.content .title {
  position: relative;
}

.mission {
  width: 1000px;
  margin: 60px auto 0;
  text-align: left;
}

.mission ul > li {
  padding: 23px 15px;
  border: 1px solid #000;
  background: #fee55a;
  margin: 0 0 15px;
  position: relative;
}

.mission ul > li > h3,
.mission ul > li > p,
.mission ul > li > i {
  display: inline-block;
  margin: 0;
  font-size: 20px;
  color: #000;
  font-weight: 700;
}

.mission ul > li > p {
  color: #14713d;
}

.mission ul > li > i {
  font-style: normal;
	color: #000;
}

.missionGet {
  background: transparent url(../img/misson-icon.png) no-repeat 0 0;
  width: 88px;
  height: 88px;
  position: absolute;
  right: 10px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.mission ul > li > i > span {
  color: #db1912;
}

/* gunList style */
.gunList {
  padding: 60px 0 0;
}

.content #con3 .gunList {
  padding-bottom: 100px;
}

.gunList .tab_con {
  width: 1200px;
  margin: 0 auto;
}

.gunList .tab_con ul li {
  width: 393px;
  height: 224px;
  display: block;
  position: relative;
  float: left;
  margin: 3px;
}

[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}

[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
  cursor: pointer;
}

#gun_tab1 ul > li {
  cursor: zoom-in;
}

[type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before,
#gun_tab1 ul > li:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("../img/gunlist_off.png") 0 0 no-repeat;
  transition: background-image 0.3s ease;
}

[type="checkbox"]:not(:checked) + label[for="gun1-1"]:before,
[type="checkbox"]:checked + label[for="gun1-1"]:before,
#gun_tab1 ul > li:first-child:before {
  /* background-position: -8px 0; */
}

[type="checkbox"]:not(:checked) + label[for="gun1-2"]:before,
[type="checkbox"]:checked + label[for="gun1-2"]:before,
#gun_tab1 ul > li:nth-child(2):before {
  background-position: -403px 0;
}

[type="checkbox"]:not(:checked) + label[for="gun1-3"]:before,
[type="checkbox"]:checked + label[for="gun1-3"]:before,
#gun_tab1 ul > li:nth-child(3):before {
  background-position: 100% 0;
}

[type="checkbox"]:not(:checked) + label[for="gun1-4"]:before,
[type="checkbox"]:checked + label[for="gun1-4"]:before,
#gun_tab1 ul > li:nth-child(4):before {
  background-position: 0 -238px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-5"]:before,
[type="checkbox"]:checked + label[for="gun1-5"]:before,
#gun_tab1 ul > li:nth-child(5):before {
  background-position: -403px -238px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-6"]:before,
[type="checkbox"]:checked + label[for="gun1-6"]:before,
#gun_tab1 ul > li:nth-child(6):before {
  background-position: 100% -238px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-7"]:before,
[type="checkbox"]:checked + label[for="gun1-7"]:before,
#gun_tab1 ul > li:nth-child(7):before {
  background-position: 0 -474px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-8"]:before,
[type="checkbox"]:checked + label[for="gun1-8"]:before,
#gun_tab1 ul > li:nth-child(8):before {
  background-position: -403px -474px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-9"]:before,
[type="checkbox"]:checked + label[for="gun1-9"]:before,
#gun_tab1 ul > li:nth-child(9):before {
  background-position: 100% -474px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-10"]:before,
[type="checkbox"]:checked + label[for="gun1-10"]:before,
#gun_tab1 ul > li:nth-child(10):before {
  background-position: 0 -712px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-11"]:before,
[type="checkbox"]:checked + label[for="gun1-11"]:before,
#gun_tab1 ul > li:nth-child(11):before {
  background-position: -403px -712px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-12"]:before,
[type="checkbox"]:checked + label[for="gun1-12"]:before,
#gun_tab1 ul > li:nth-child(12):before {
  background-position: 100% -712px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-13"]:before,
[type="checkbox"]:checked + label[for="gun1-13"]:before,
#gun_tab1 ul > li:nth-child(13):before {
  background-position: 0 -950px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-14"]:before,
[type="checkbox"]:checked + label[for="gun1-14"]:before,
#gun_tab1 ul > li:nth-child(14):before {
  background-position: -403px -950px;
}

[type="checkbox"]:not(:checked) + label[for="gun1-15"]:before,
[type="checkbox"]:checked + label[for="gun1-15"]:before,
#gun_tab1 ul > li:nth-child(15):before {
  background-position: 100% -950px;
}

[type="checkbox"]:checked + label:before {
  background-image: url("../img/gunlist_on.png");
}

.gunList .tab_con ul li:hover [type="checkbox"]:not(:checked) + label:before,
.gunList .tab_con ul li:hover [type="checkbox"]:checked + label:before,
#gun_tab1 ul > li:hover:before {
  background-image: url("../img/gunlist_on.png");
}

[type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
  content: "";
  position: absolute;
  top: 0px;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/check_on.png) no-repeat 0 0;
  filter: drop-shadow(0px 0px 15px rgba(48, 179, 255, 0.6));
}

[type="checkbox"]:not(:checked) + label:after,
#gun_tab1 ul > li:hover:after {
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
}

[type="checkbox"]:checked + label:after,
#gun_tab1 ul > li:hover:after {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

[type="checkbox"][disabled]:not(:checked) + label:before,
[type="checkbox"][disabled]:checked + label:before {
  opacity: 0.5;
  cursor: default;
  cursor: not-allowed;
}

.popover {
  max-width: 100%;
  background: transparent;
  padding: 0;
  border-radius: 0;
  border: none;
  pointer-events: none;
}

.popover2 {
  position: absolute;
  pointer-events: none;
  z-index: 999;
}

.gunList .tab_con .select li {
  width: 392px;
  height: 280px;
  background: url(../img/selectbox.jpg) no-repeat 0 0;
  position: relative;
}

.gunList .tab_con .select li img {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 7;
}

.weaponBtn {
  margin-top: 50px;
}

.weaponBtn,
.weaponBtn:hover {
  background-position-y: -114px;
}

.wpNotice {
  color: #b21b0a;
  font-size: 16px;
  margin: 15px 0 0;
	font-weight: 700;
}

/* gunlist style */

.serialNum {
  width: 600px;
  margin: 50px auto 50px;
}

.serialNum label {
  background: url(../img/serial_label.png) no-repeat 0 0;
	width: 137px;
	height: 54px;
	text-indent: -99999em;
}

.serialNum .form-control {
  width: 345px;
  border-radius: 0;
  border: 1px solid #000;
  background: #fee55a;
  font-size: 18px;
  color: #000;
}

.serialNum .copyBtn {
  font-family: "微軟正黑體", Nanum Barun Gothic, sans-serif;
  background: #000;
  padding: 6px 36px;
  border: 1px solid #000;
  border-radius: 0;
  font-size: 18px;
  font-weight: 400;
  height: 46px;
  color: #fff;
  border-radius: 0;
	margin-left: -4px;
}

.serialNum .copyBtn:hover {
  background: #17577a;
  color: #fff;
  box-shadow: 0px 0px 5px rgba(255, 255, 255, 0.9) inset,
    0px 0px 10px rgba(255, 255, 255, 0.9) inset;
}

.center-block {
  margin: 20px 0 0;
}

.serialBtn,
.serialBtn:hover {
  border: none;
  outline: none;
  background-position-y: 100%;
	width: 325px;
}

.wrap .tab li {
  position: absolute;
  list-style-type: none;
}

.wrap .tab li::after {
  filter: drop-shadow(-5px 5px 5px rgba(0, 0, 0, 0.6));
}

.copyright {
  text-align: left;
  padding: 0;
}

@keyframes opacity {
  50% {
    opacity: 1;
  }
}

@-webkit-keyframes opacity {
  50% {
    opacity: 1;
  }
}

@keyframes bgChange {
  50% {
    background: transparent url(../img/btn_hover.png) no-repeat 0 0;
  }
}

@-webkit-keyframes bgChange {
  50% {
    background: transparent url(../img/btn_hover.png) no-repeat 0 0;
  }
}

@-webkit-keyframes blinking {
  40% {
    opacity: 0.7;
    -webkit-transform: skew(-3deg);
    transform: skew(-3deg);
  }

  50% {
    opacity: 1;
    -webkit-transform: skew(0);
    transform: skew(0);
  }

  70% {
    opacity: 0.9;
    -webkit-transform: skew(3deg);
    transform: skew(3deg);
  }
}

@keyframes blinking {
  40% {
    opacity: 0.7;
    -webkit-transform: skew(-3deg);
    transform: skew(-3deg);
  }

  50% {
    opacity: 1;
    -webkit-transform: skew(0);
    transform: skew(0);
  }

  70% {
    opacity: 0.9;
    -webkit-transform: skew(3deg);
    transform: skew(3deg);
  }
}

@-webkit-keyframes effect {
  40% {
    opacity: 0.4;
    -webkit-transform: skew(-90deg) translateX(-10px);
    transform: skew(-90deg) translateX(-10px);
  }

  50% {
    opacity: 1;
  }

  60% {
    opacity: 0.8;
    -webkit-transform: skew(80deg) translateX(10px);
    transform: skew(80deg) translateX(10px);
  }
}

@keyframes effect {
  40% {
    opacity: 0.4;
    -webkit-transform: skew(-90deg) translateX(-10px);
    transform: skew(-90deg) translateX(-10px);
  }

  50% {
    opacity: 1;
  }

  60% {
    opacity: 0.8;
    -webkit-transform: skew(80deg) translateX(10px);
    transform: skew(80deg) translateX(10px);
  }
}

@-webkit-keyframes zoomOut {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(2, 2, 2);
    transform: scale3d(2, 2, 2);
    -webkit-transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
    transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes zoomOut {
  0% {
    opacity: 0;
    -webkit-transform: scale3d(2, 2, 2);
    transform: scale3d(2, 2, 2);
    -webkit-transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
    transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

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

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate(-100px);
    -ms-transform: translate(-100px);
    transform: translate(-100px);
    -webkit-transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
    transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
  }

  to {
    opacity: 1;
    -ms-transform: translate(0);
    transform: translate(0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate(-100px);
    -ms-transform: translate(-100px);
    transform: translate(-100px);
    -webkit-transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
    transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
  }

  to {
    opacity: 1;
    -ms-transform: translate(0);
    transform: translate(0);
  }
}

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

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate(100px);
    -ms-transform: translate(100px);
    transform: translate(100px);
    -webkit-transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
    transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
  }

  to {
    opacity: 1;
    -webkit-transform: translate(0);
    -ms-transform: translate(0);
    transform: translate(0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate(100px);
    -ms-transform: translate(100px);
    transform: translate(100px);
    -webkit-transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
    transition-timing-function: cubic-bezier(0.2, 0.7, 0.6, 1);
  }

  to {
    opacity: 1;
    -webkit-transform: translate(0);
    -ms-transform: translate(0);
    transform: translate(0);
  }
}

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

.animated {
  -webkit-animation-duration: 0.6s;
  animation-duration: 0.6s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@keyframes glitch1 {
  0% {
    transform: none;
    opacity: 1;
  }

  7% {
    transform: skew(-0.5deg, -0.9deg);
    opacity: 0.75;
  }

  10% {
    transform: none;
    opacity: 1;
  }

  27% {
    transform: none;
    opacity: 1;
  }

  30% {
    transform: skew(0.8deg, -0.1deg);
    opacity: 0.75;
  }

  35% {
    transform: none;
    opacity: 1;
  }

  52% {
    transform: none;
    opacity: 1;
  }

  55% {
    transform: skew(-1deg, 0.2deg);
    opacity: 0.75;
  }

  50% {
    transform: none;
    opacity: 1;
  }

  72% {
    transform: none;
    opacity: 1;
  }

  75% {
    transform: skew(0.4deg, 1deg);
    opacity: 0.75;
  }

  80% {
    transform: none;
    opacity: 1;
  }

  100% {
    transform: none;
    opacity: 1;
  }
}

@keyframes glitch2 {
  0% {
    transform: none;
    opacity: 0.25;
  }

  7% {
    transform: translate(-2px, -3px);
    opacity: 0.5;
  }

  10% {
    transform: none;
    opacity: 0.25;
  }

  27% {
    transform: none;
    opacity: 0.25;
  }

  30% {
    transform: translate(-5px, -2px);
    opacity: 0.5;
  }

  35% {
    transform: none;
    opacity: 0.25;
  }

  52% {
    transform: none;
    opacity: 0.25;
  }

  55% {
    transform: translate(-5px, -1px);
    opacity: 0.5;
  }

  50% {
    transform: none;
    opacity: 0.25;
  }

  72% {
    transform: none;
    opacity: 0.25;
  }

  75% {
    transform: translate(-2px, -6px);
    opacity: 0.5;
  }

  80% {
    transform: none;
    opacity: 0.25;
  }

  100% {
    transform: none;
    opacity: 0.25;
  }
}

@keyframes glitch3 {
  0% {
    transform: none;
    opacity: 0.25;
  }

  7% {
    transform: translate(2px, 3px);
    opacity: 0.5;
  }

  10% {
    transform: none;
    opacity: 0.25;
  }

  27% {
    transform: none;
    opacity: 0.25;
  }

  30% {
    transform: translate(5px, 2px);
    opacity: 0.5;
  }

  35% {
    transform: none;
    opacity: 0.25;
  }

  52% {
    transform: none;
    opacity: 0.25;
  }

  55% {
    transform: translate(5px, 1px);
    opacity: 0.5;
  }

  50% {
    transform: none;
    opacity: 0.25;
  }

  72% {
    transform: none;
    opacity: 0.25;
  }

  75% {
    transform: translate(2px, 6px);
    opacity: 0.5;
  }

  80% {
    transform: none;
    opacity: 0.25;
  }

  100% {
    transform: none;
    opacity: 0.25;
  }
}