@import url("../css/animate.css");

html {
  height: 100%;
  overflow: hidden;
}
body {
  background: #131519;
  padding: 0;
  font-family: "Adobe 繁黑體 Std B","微軟正黑體","Arial";
  position: relative;
  margin: 0;
  height: 100%;
  -webkit-font-smoothing: antialiased;
  overflow: hidden;

}
.wrapper {
  /*height: 100% !important;*/
  height: 950px;
  margin: 0 auto;
  overflow: hidden;
}
.pointer {
  color: #9b59b6;
  font-family: 'Pacifico', cursive;
  font-size: 30px;
  margin-top: 15px;
}
code {
  margin: 20px 1%;
  float: left;
  width: 48%;
  height: 105px;
  background: rgba(0,0,0,0.1);
  border: rgba(0,0,0,0.05) 5px solid;
  border-radius: 5px;
  padding: 5px;
  color: white;
  text-align: center;
  font-size: 15px;
  margin-top: 25px;
  display: block;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}
code.html {
  color: #7EC9E6;
}
code.js {
  color: #FFAD00;
}
.main {
  float: left;
  width: 100%;
  margin: 0 auto;
}
.main h1 {
  padding: 150px 50px;
  float: left;
  width: 100%;
  font-size: 45px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  font-weight: 100;
  color: white;
  margin: 0;
}
.main h1.demo1 {
  background: #1ABC9C;
}
.reload.bell {
  font-size: 12px;
  padding: 20px;
  width: 45px;
  text-align: center;
  height: 47px;
  border-radius: 50px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
}
.reload.bell #notification {
  font-size: 25px;
  line-height: 140%;
}
.reload, .btn {
  display: inline-block;
  border: 4px solid #A2261E;
  border-radius: 5px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  background: #CC3126;
  display: inline-block;
  line-height: 100%;
  padding: 0.7em;
  text-decoration: none;
  color: #fff;
  width: 100px;
  line-height: 140%;
  font-size: 17px;
  font-family: open sans;
  font-weight: bold;
}
.reload:hover {
  background: #444;
}
.btn {
  width: 200px;
  color: rgb(255, 255, 255);
  border: 4px solid rgb(0, 0, 0);
  background: rgba(3, 3, 3, 0.75);
}
.clear {
  width: auto;
}
.btn:hover, .btn:hover {
  background: #444;
}
.btns {
  width: 410px;
  margin: 50px auto;
}
.credit {
  text-align: center;
  color: rgba(0,0,0,0.5);
  padding: 10px;
  width: 410px;
  clear: both;
}
.credit a {
  color: rgba(0,0,0,0.85);
  text-decoration: none;
  font-weight: bold;
  text-align: center;
}
.back {
  position: absolute;
  top: 0;
  left: 0;
  text-align: center;
  display: block;
  padding: 7px;
  width: 100%;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  background: rgba(255, 255, 255, 0.25);
  font-weight: bold;
  font-size: 13px;
  color: #000;
  -webkit-transition: all 500ms ease-in-out;
  -moz-transition: all 500ms ease-in-out;
  -o-transition: all 500ms ease-in-out;
  transition: all 500ms ease-in-out;
}
.back:hover {
  color: black;
  background: rgba(255, 255, 255, 0.5);
}
header {
  position: relative;
  z-index: 10;
}
.main section .page_container {
  width: 1200px;
  height: 950px;
  display: block;
  margin: auto;
  position: relative;
  z-index: 999;
}
.main section {
  overflow: hidden;
}
.main section > img {
  position: absolute;
  max-width: 100%;
  z-index: 1;
}
.page_container .p1 {
  position: absolute;
  display: block;
}
/*-----------------------------------------p1-----------------------*/
.main section.page1 {
  background-image: url(../images/index/bg01.jpg);
  background-repeat: no-repeat;
  background-position: center top;
}
.page1 .page_container .slong {
  width: 377px;
  height: 267px;
  top: 15%;
  left: 8%;
  background-image: url(../images/index/slong.png);  
}
/*開始遊戲*/
.page1 .page_container .gamestart {
  width: 296px;
  height: 340px;
  top: 58%;
  left: 25%;
  background-image: url(../images/index/page1_btn_03.png);
  cursor: pointer;
}
.page1 .page_container .gamestart:hover {
  width: 296px;
  height: 340px;
  top: 58%;
  left: 25%;
  background-image: url(../images/index/page1_btn_03_hover.png);
  cursor: pointer;
}
.gamestart-animate{
  position: absolute;
  z-index: 5;
  top: 45%;
  left: 0;
  width: 100%;
  opacity: 0;
  animation: 5s flash infinite;
}

/*三個光*/
.gamestart:hover .gamestart-animate,
.gameinter:hover .gameinter-animate,
.download:hover .download-animate{
  opacity: 0;
  animation: 1.5s flash infinite;
}

/*遊介*/
.page1 .page_container .gameinter {
  width: 181px;
  height: 202px;
  top: 76%;
  left: 12%;
  background-image: url(../images/index/page1_btn_02.png);
  cursor: pointer;
}
.page1 .page_container .gameinter:hover {
  width: 181px;
  height: 202px;
  top: 76%;
  left: 12%;
  background-image: url(../images/index/page1_btn_02_hover.png);
  cursor: pointer;
}
.gameinter-animate{
  position: absolute;
  z-index: 5;
  top: 40%;
  left: 0;
  width: 100%;
  opacity: 0;
  animation: 5s flash infinite;
}

/*微端下載*/
.page1 .page_container .download {
  width: 181px;
  height: 202px;
  top: 55%;
  left: 12%;
  background-image: url(../images/index/page1_btn_01.png);  
  cursor: pointer;
}
.page1 .page_container .download:hover {
  width: 181px;
  height: 202px;
  top: 55%;
  left: 12%;
  background-image: url(../images/index/page1_btn_01_hover.png);
  cursor: pointer;
}
.download-animate{
  position: absolute;
  z-index: 5;
  top: 35%;
  left: 0;
  width: 100%;
  opacity: 0;
  animation: 5s flash infinite;
}

.page1 .page_container .news {
  width: 400px;
  height: 270px;
  top: 63%;
  right: 9%;
  background-image: url(../images/index/news_bg.png);
  background-repeat: no-repeat;
}
.page1 .page_container .news .news-title {
  height: 50px;
  width: 350px;
  border-bottom: 2px dotted #ABABAB;
  display: block;
  box-sizing: border-box;
  margin: 18px auto 15px auto;
}
.page1 .page_container .news .news-title h3 {
  font-family: "中國龍超明體", "華康超明體(P)","Arial";
  font-size: 24px;
  line-height: 40px;
  color: #fff;
  float: left;
  height: 40px;
  width: 200px;
  padding-left: 10px;
  font-weight: bold;
  vertical-align: middle;
  display: block;
}
.page1 .page_container .news .news-title h3 span {
  font-family: "Adobe 繁黑體 Std B","微軟正黑體","Arial";
  font-size: 18px;
  line-height: 40px;
  color: #fff;
  height: 40px;
  padding-left: 10px;
  font-weight: bold;
  vertical-align: middle;
}

.page1 .page_container .news .news-title .more {
  font-family: "Adobe 繁黑體 Std B","微軟正黑體","Arial";
  font-size: 14px;
  line-height: 25px;
  color: #BDBDBD;
  height: 25px;
  width: 50px;
  float: right;
  text-align: center;
  display: block;
  margin-top: 13px;
}
.page1 .page_container .news .news-title .more:hover {
  color: #FFFFFF;
}
.page1 .page_container .news .news-content {
  display: block;
  width: 350px;
  overflow: hidden;
  margin: auto;
}
.page1 .page_container .news .news-content li {
  height: 35px;
  padding-right: 10px;
  padding-left: 10px;
  display: block;
  box-sizing: border-box;
  overflow: hidden;
}
.page1 .page_container .news .news-content li:hover {
  box-sizing: border-box;
}
.page1 .page_container .news .news-content li:hover .to, .page1 .page_container .news .news-content li:hover .laer, .page1 .page_container .news .news-content li:hover .date {
  color: #fff;
  text-shadow: 1px 1px 2px #000, 1px 1px 2px #000, 1px 1px 2px #000;
}
.page1 .page_container .news .news-content li .to {
  font-size: 14px;
  line-height: 35px;
  color: #BDBDBD;
  float: left;
  width: 12%;
  display: inline-block;
}
.page1 .page_container .news .news-content li .laer {
  font-size: 14px;
  line-height: 35px;
  color: #BDBDBD;
  float: left;
  height: 35px;
  width: 63%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
}
.page1 .page_container .news .news-content li .date {
  font-size: 14px;
  line-height: 35px;
  color: #BDBDBD;
  text-align: right;
  float: left;
  height: 35px;
  width: 25%;
  display: inline-block;
  overflow: hidden;
}



/*-------------------------------------------------p2----------------------*/
.main section.page2 {
  background-image: url(../images/index/bg02.jpg);
  background-repeat: no-repeat;
  background-position: center top;
}
.main section.page2 > img {
  position: absolute;
  top: -300px;
  left: 50%;
  margin-left: -1095px;
}
.main section.page2 .page_container {
  overflow: hidden;
}
/*---職業介紹--*/
.job {
  float: left;
  height: 524px;
  width: 1096px;
}
.job .p2-line{
  position: absolute;
  background-image: url(../images/index/p2-line.png);
  background-repeat: no-repeat;
  height: 524px;
  width: 1096px;
  z-index: 99;
}
.job .bd {
  display: block;
}
.job .bd .info .tabto {
  position: absolute;
  z-index: 50;
  display: block;
  width: 500px;
  margin: 5% 0 0 5%;

}
.job .bd .info .tabto p {
  color: #ECECEC;
  font-family: "微軟正黑體", "Adobe 繁黑體 Std B";
  font-size: 18px;
  font-weight: bold;
  white-space: normal;
  letter-spacing: -1px;
  line-height: 36px;
  text-align: justify;
  text-justify: inter-ideograph;
  margin: 10px 0 0 0;
}
.job .bd .info .tabto p span{
  color: #000000;
  font-family: "微軟正黑體", "Adobe 繁黑體 Std B";
  font-size: 20px;
  line-height: 20px;
  font-weight: bold;
  background-color: #00deff;
  padding: 0 10px;
  margin: 0 10px 0 0;
}

.job .bd .info .tabto h3 {
  color: #000000;
  font-family: "微軟正黑體", "Adobe 繁黑體 Std B";
  font-size: 20px;
  line-height: 24px;
  font-weight: bold;
  background-color: #00deff;
  padding: 0 10px;
  margin: 0 10px 0 0;
  display: inline-block;
  letter-spacing: -1px;

}
.job .bd .info .tabto .star-4{
  width: 120px;
  height: 30px;
  background-image: url(../images/index/star-cur.png);
  background-position: 0 5px;
  background-repeat: repeat-x;
  display: inline-block;
  margin: 0 0 -3px 0;
}
.job .bd .info .tabto .star-5{
  width: 150px;
  height: 30px;
  background-image: url(../images/index/star-cur.png);
  background-position: 0 5px;
  background-repeat: repeat-x;
  display: inline-block;
  margin: 0 0 -3px 0;
}
.job .bd .info .tabto .star-0{
  width: 30px;
  height: 30px;
  background-image: url(../images/index/star.png);
  background-position: 0 5px;
  background-repeat: repeat-x;
  display: inline-block;
  margin: 0 0 -3px 0;
}

.info .movie_job {
  height: 524px;
  width: 1096px;
  overflow: hidden;
  z-index: 0;
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s
}

#setli-bg01 {
	background-image: url(../images/index/btn_01.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}
#abgne-block-20110111 .job-title li.on_0, #setli-bg01:hover {
	background-image: url(../images/index/btn_01_hover.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}
#setli-bg02 {
	background-image: url(../images/index/btn_02.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}
#abgne-block-20110111 .job-title li.on_1, #setli-bg02:hover {
	background-image: url(../images/index/btn_02_hover.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}
#setli-bg03 {
	background-image: url(../images/index/btn_03.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}
#abgne-block-20110111 .job-title li.on_2, #setli-bg03:hover {
	background-image: url(../images/index/btn_03_hover.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}
#setli-bg04 {
	background-image: url(../images/index/btn_04.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}
#abgne-block-20110111 .job-title li.on_3, #setli-bg04:hover {
	background-image: url(../images/index/btn_04_hover.png);
	background-repeat: no-repeat;
	height: 80px;
	width: 267px;
}

/*--職業--*/
#abgne-block-20110111 {
  width: 1096px;
  height: 524px;
  box-sizing: border-box;
  margin: 20% auto 0 auto;
  position: absolute;
  left: 50%;
  margin-left: -548px;
}
#abgne-block-20110111 .info {
  display: none;
  height: 524px;
  width: 1096px;
}

#abgne-block-20110111 .on {
  display: block;
}
#abgne-block-20110111 .job-title {
  width: 1100px;
  height: 80px;
  position: absolute;
  z-index: 50;
  bottom: -90px;
  margin: auto;
}
#abgne-block-20110111 .job-title ul {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between
}

#abgne-block-20110111 .job-title li {
  cursor: pointer;
  width: 267px;
  height: 80px;
}
#abgne-block-20110111 .job-title li.on,
#abgne-block-20110111 .job-title li.over {
	-webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s
}

/*----------------------------------------------------p3---------*/
.main section.page3 {
  background-image: url(../images/index/bg03.jpg);
  background-repeat: no-repeat;
  background-position: center top;
}
.main section.page3 .page_container {
  overflow: hidden;
}

.grid {
	position: relative;
	clear: both;
	margin: 0 auto;
	padding: 20% 0 0 0;
	max-width: 1200px;
	list-style: none;
	text-align: center;
}

/* Common style */
.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	width: 270px;
	height: 500px;
	text-align: center;
	cursor: pointer;
  padding: 0;
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.8;
}
.grid figure.pic1 {
  background-image: url(../images/index/page3_pic1.jpg);
  background-repeat: no-repeat;
	position: relative;
	display: block;
  width: 270px;
  height: 500px;
}
.grid figure.pic1:hover {
  background-image: url(../images/index/page3_pic1_hover.jpg);
  background-repeat: no-repeat;
	position: relative;
	display: block;
}
.grid figure.pic2 {
  background-image: url(../images/index/page3_pic2.jpg);
  background-repeat: no-repeat;
	position: relative;
	display: block;
  width: 270px;
  height: 500px;
}
.grid figure.pic2:hover {
  background-image: url(../images/index/page3_pic2_hover.jpg);
  background-repeat: no-repeat;
	position: relative;
	display: block;
}
.grid figure.pic3 {
  background-image: url(../images/index/page3_pic3.jpg);
  background-repeat: no-repeat;
	position: relative;
	display: block;
  width: 270px;
  height: 500px;
}
.grid figure.pic3:hover {
  background-image: url(../images/index/page3_pic3_hover.jpg);
  background-repeat: no-repeat;
	position: relative;
	display: block;
}


.grid figure figcaption {
	padding: 40% 5%;
	color: #fff;
	text-transform: uppercase;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
  box-sizing: border-box;
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}
.grid figure figcaption:hover {
  background-color: rgba(0,0,0,0.4);
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}


figure.effect-julia {
  width: 270px;
  height: 500px;
  margin: 0 5.4%;
}

figure.effect-julia img ,figure.pic1 ,figure.pic2 ,figure.pic3,
figure.pic1:hover ,figure.pic2:hover ,figure.pic3:hover{
	max-width: none;
	height: 500px;
	-webkit-transition: opacity 1s, -webkit-transform 1s;
	transition: opacity 1s, transform 1s;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
  
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}

figure.effect-julia figcaption {
	text-align: left;
}

figure.effect-julia h2 {
	position: relative;
	padding: 0.5em 0;
}

figure.effect-julia li {
	display: inline-block;
	margin: 2% 0.5%;
	text-transform: none;
  width: 75px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  box-sizing: border-box;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: translate3d(-360px,0,0);
	transform: translate3d(-360px,0,0);
}
figure.effect-julia li:hover {
	color: #000;
  background-color: #fff;
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}
figure.effect-julia li:hover ,figure.effect-julia li:hover a{
	color: #000;
  -webkit-transition: all 1s;
	-moz-transition: all 1s;
	-o-transition: all 1s;
	transition: all 1s;
}
figure.effect-julia li a{
	color: #fff;
	font-size: 12px;
	font-weight: 500;
}


figure.effect-julia li:first-child {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

figure.effect-julia li:nth-of-type(2) {
	-webkit-transition-delay: 0.18s;
	transition-delay: 0.18s;
}

figure.effect-julia li:nth-of-type(3) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}
figure.effect-julia li:nth-of-type(4) {
	-webkit-transition-delay: 0.14s;
	transition-delay: 0.14s;
}
figure.effect-julia li:nth-of-type(5) {
	-webkit-transition-delay: 0.12s;
	transition-delay: 0.12s;
}
figure.effect-julia li:nth-of-type(6) {
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}
figure.effect-julia li:nth-of-type(7) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}
figure.effect-julia li:nth-of-type(8) {
	-webkit-transition-delay: 0.06s;
	transition-delay: 0.06s;
}
figure.effect-julia li:nth-of-type(9) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}
figure.effect-julia li:nth-of-type(10) {
	-webkit-transition-delay: 0.02s;
	transition-delay: 0.02s;
}
figure.effect-julia li:nth-of-type(11) {
	-webkit-transition-delay: 0.01s;
	transition-delay: 0.01s;
}


figure.effect-julia:hover li:first-child {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}

figure.effect-julia:hover li:nth-of-type(2) {
	-webkit-transition-delay: 0.02s;
	transition-delay: 0.02s;
}

figure.effect-julia:hover li:nth-of-type(3) {
	-webkit-transition-delay: 0.04s;
	transition-delay: 0.04s;
}
figure.effect-julia:hover li:nth-of-type(4) {
	-webkit-transition-delay: 0.06s;
	transition-delay: 0.06s;
}
figure.effect-julia:hover li:nth-of-type(5) {
	-webkit-transition-delay: 0.08s;
	transition-delay: 0.08s;
}
figure.effect-julia:hover li:nth-of-type(6) {
	-webkit-transition-delay: 0.1s;
	transition-delay: 0.1s;
}
figure.effect-julia:hover li:nth-of-type(7) {
	-webkit-transition-delay: 0.12s;
	transition-delay: 0.12s;
}
figure.effect-julia:hover li:nth-of-type(8) {
	-webkit-transition-delay: 0.14s;
	transition-delay: 0.14s;
}
figure.effect-julia:hover li:nth-of-type(9) {
	-webkit-transition-delay: 0.16s;
	transition-delay: 0.16s;
}
figure.effect-julia:hover li:nth-of-type(10) {
	-webkit-transition-delay: 0.18s;
	transition-delay: 0.18s;
}
figure.effect-julia:hover li:nth-of-type(11) {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}

figure.effect-julia:hover img {
	opacity: 0.4;
	/*-webkit-transform: scale3d(1.1,1.1,1);
	transform: scale3d(1.1,1.1,1);*/
}

figure.effect-julia:hover li {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
/*----------------------------------------------------p4---------*/
.main section.page4 {
  background-image: url(../images/index/bg04.jpg);
  background-repeat: no-repeat;
  background-position: center top;
}
.main section.page4 .page_container {
  overflow: hidden;
}

.main section.page4 .page_container .adbanner {
	height: 628px;
	width: 1200px;
  margin: 5% auto 2% auto;
}
.p4-line{
  width: 1200px;
  height: 628px;
  position: absolute;
  z-index: 11;
  background-image: url(../images/index/p4-line.png);
  background-repeat: no-repeat;  
  margin: 5% auto 2% auto;
}
/*輪播bn*/
#abgne_fade_pic {
	position: relative;
	width: 1200px;
	height: 628px;
}
#abgne_fade_pic a.ad {
	position: absolute;	/* 讓圖片疊在一起 */
}
#abgne_fade_pic .control {
	position: absolute;
	right: 10%;
	bottom: 3%;
}
#abgne_fade_pic .control a {
	display: inline-block;
	width: 10px;
	text-align: center;
	font-size: 0px;
	text-decoration: none;
	background-color: #FFF;
	height: 10px;
	border-radius: 5px;
	color: #FFF;
	margin-right: 8px;
}
#abgne_fade_pic .control a.on {
	background-color: #FC0;
}
.dise {
	height: 90px;
	width: 1200px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.dise .dise-box {
	height: 90px;
	width: 355px;
	display: inline-block;
}
.dise .dise-free {
  background-image: url(../images/index/page4_btn_1.jpg);
  background-repeat: no-repeat;
  transition: all 600ms ease;
}
.dise .dise-free:hover {
  background-image: url(../images/index/page4_btn_1_hover.jpg);
  background-repeat: no-repeat;
  transition: all 600ms ease;
}
.dise .dise-customer {
  background-image: url(../images/index/page4_btn_2.jpg);
  background-repeat: no-repeat;
  transition: all 600ms ease;
}
.dise .dise-customer:hover {
  background-image: url(../images/index/page4_btn_2_hover.jpg);
  background-repeat: no-repeat;
  transition: all 600ms ease;
}
/*-------------------------------------------------------------*/

body.disabled-onepage-scroll .onepage-wrapper section {
  min-height: 100%;
  height: auto;
}
body.disabled-onepage-scroll .main section .page_container, body.disabled-onepage-scroll .main section.page3 .page_container {
  padding: 20px;
  margin-top: 150px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
body.disabled-onepage-scroll section .page_container h1 {
  text-align: center;
  font-size: 50px;
}
body.disabled-onepage-scroll section .page_container h2, body.disabled-onepage-scroll section .page_container .credit, body.disabled-onepage-scroll section .page_container .btns {
  text-align: center;
  width: 100%;
}
body.disabled-onepage-scroll .main section.page1 > img {
  position: absolute;
  width: 80%;
  left: 10%;
}
body.disabled-onepage-scroll .main section > img {
  position: relative;
  max-width: 80%;
  bottom: 0;
}
body.disabled-onepage-scroll code {
  width: 95%;
  margin: 0 auto 25px;
  float: none;
  overflow: hidden;
}
body.disabled-onepage-scroll .main section.page3 .page_container {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  right: 0;
}

/*-------------------------------------------------------------*/