@charset "UTF-8";


html,body{width:100%;height:100%;background:#000;margin:0 auto;-webkit-tap-highlight-color:transparent; overflow: hidden; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC","Helvetica Neue",STHeiti,"Microsoft Yahei",Tahoma,Simsun,sans-serif;}
.clear{clear: both;}
.hide{display:none;}
.visibility{visibility: hidden}
ul,li{ list-style: none; margin: 0; padding: 0}

input {
    outline: none;
    -webkit-appearance: none; /*去除系统默认的样式*/
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* 点击高亮的颜色*/
}
/*设置IOS页面长按不可复制粘贴，但是IOS上出现input、textarea不能输入，因此将使用-webkit-user-select:auto;*/
/**{*/
/*    -webkit-touch-callout:none;  !*系统默认菜单被禁用*!*/
/*    -webkit-user-select:none; !*webkit浏览器*!*/
/*    -khtml-user-select:none; !*早期浏览器*!*/
/*    -moz-user-select:none;!*火狐*!*/
/*    -ms-user-select:none; !*IE10*!*/
/*    user-select:none;*/
/*}*/
.content{
    margin:0 auto;
    position: absolute;
    background: #000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
}
.divbottom{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1500px;
    overflow: hidden;
}

.in_up { -webkit-animation:in_up 0.4s ease both; }
@-webkit-keyframes in_up    {
    0% { -webkit-transform:translate3d(0,30px,0); opacity:0; }
    100% { -webkit-transform:translate3d(0,0,0); opacity:1; }
}
.in_down { -webkit-animation:in_down 0.4s ease both; }
@-webkit-keyframes in_down    {
    0% { -webkit-transform:translate3d(0,-30px,0); opacity:0; }
    100% { -webkit-transform:translate3d(0,0,0); opacity:1; }
}
.in_left { -webkit-animation:in_left 0.4s ease both; }
@-webkit-keyframes in_left    {
    0% { -webkit-transform:translate3d(30px,0,0); opacity:0; }
    100% { -webkit-transform:translate3d(0,0,0); opacity:1; }
}
.in_right { -webkit-animation:in_right 0.4s ease both; }
@-webkit-keyframes in_right    {
    0% { -webkit-transform:translate3d(-30px,0,0); opacity:0; }
    100% { -webkit-transform:translate3d(0,0,0); opacity:1; }
}
.in_alpha { -webkit-animation:in_alpha 0.4s ease both; }
@-webkit-keyframes in_alpha    {
    0% { -webkit-transform:translate3d(0,0,0); opacity:0; }
    100% { -webkit-transform:translate3d(0,0,0); opacity:1; }
}

.in_up2 { -webkit-animation:in_up 1.5s ease both; }
.in_down2 { -webkit-animation:in_down 1.5s ease both; }
.in_left2 { -webkit-animation:in_left 1.5s ease both; }
.in_right2 { -webkit-animation:in_right 1.5s ease both; }
.in_alpha2 { -webkit-animation:in_alpha 1.5s ease both; }

.cnv,.env
.page0{
    filter: alpha(opacity=1);
    -moz-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    z-index: 20;
    /*z-index:9;*/
    /*background:#131313*/
}

.ju1{
    position:absolute;
    /*border:1px solid #000;*/
    top:50%;
    width: 100%;
    height: 1200px;
    /*margin-left: 44px;*/
    vertical-align:middle;
　　display:table-cell;
　　_position:absolute;
　　_top:50%;

}
.ju2{
    /*border:1px solid #000;*/
    position:relative;
    top:-50%;
    /*background-color: #285385;*/
    /*border-radius: 30px;*/
    width: 100%;
    height: 100%;
    _position:relative;
    　　_top:-50%;
}
.jutop_150 {
    position: relative;
    left: 0;
    top: -150px;
    width: 100%;
    height: 100%;
}
.jutop_200 {
    position: relative;
    left: 0;
    top: -200px;
    width: 100%;
    height: 100%;
}
.bor{
    border: 1px solid red;
}

.loadbg{
    background:url(../images/loading.jpg) center top no-repeat;
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 100%;
}
.p0_c {
    background:url(../images/p0_c.png) center center no-repeat;
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    height: 630px;
}


.load_div {
    position: absolute;
    left: 0px;
    top: 300px;
    width: 100%;
    height: 350px;
}



.load_k1 {
    position: absolute;
    left: 187px;
    top: 250px;
    width: 370px;
    height: 20px;
    padding: 6px;
    border-radius: 20px;
    background-color: white;
}
.load_t1 {
    width: 0%;
    height: 100%;
    border-radius: 20px;
    background: #9f6339;
}


.load_text{
    position: absolute;
    left: 0px;
    top: 300px;
    width: 100%;
    height: 50px;
    text-align: center;
    color: #fff0dd;
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC","Helvetica Neue",STHeiti,"Microsoft Yahei",Tahoma,Simsun,sans-serif;
    /*text-shadow: 3px 3px 3px #525252;*/
    /*font-style:italic;*/
    /*font-weight: bold;*/
    font-size: 28px;
    left: -13px;
}
.load_text>label{
    position: absolute;
    top: -5px;
    margin-left: 8px;
}
.load_egg_1 {
    background:url(../images/load_egg_1.png) center center no-repeat;
    position: absolute;
    left: 313px;
    /*top: 25px;*/
    top: 18px;
    width: 117px;
    height: 77px;
    transform-origin: left bottom;
}
.load_egg_2 {
    background:url(../images/load_egg_2.png) center center no-repeat;
    position: absolute;
    left: 311px;
    top: 78px;
    width: 127px;
    height: 117px;
}



.page0, .page1, .page2, .page3, .page4, .page5, .page6, .page7,.page8, .cjpage, .pagetips,  #p_tt,  #p_tt2, #tipsk, #cropper{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    /*background: black;*/
}
.page8{
    background-color: white;
}
.w_egg_bg {
    background:url(../images/w_egg_bg.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
}
.p1_w_egg_bg {
    background:url(../images/p1_egg.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
}
.p2_w_egg{
    background:url(../images/p2_egg.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
    opacity: 0;
}
.p2_gif{
    background:url(../images/p1_gif.gif) center -217px no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 651px;
    height: 925px;
}
/*.p2_gif{*/
/*    background:url(../images/p1_gif.gif) 0 -67px no-repeat;*/
/*    position: absolute;*/
/*    left: 0px;*/
/*    top: 0px;*/
/*    width: 100%;*/
/*    height: 1580px;*/
/*}*/
.w_wt1,.w_wt2,.w_wt3,.w_wt4,.w_wt5,.w_wt6{
    position: absolute;
    width: 100%;
    height: 100%;
}
.w_egg_logo {
    background:url(../images/w_egg_logo.png) center center no-repeat;
    position: absolute;
    left: 240px;
    top: 227px;
    width: 171px;
    height: 40px;
}
.w_t1_title {
    background:url(../images/w_t1_title.png) center center no-repeat;
    position: absolute;
    left: 223px;
    top: 327px;
    width: 205px;
    height: 85px;
}
.w_t1_p{
    position: absolute;
    left: 0px;
    top: 461px;
    width: 100%;
    height: 52px;
}
.w_t2_p{
    position: absolute;
    left: 0px;
    top: 533px;
    width: 100%;
    height: 52px;
}
.w_t3_p{
    position: absolute;
    left: 0px;
    top: 605px;
    width: 100%;
    height: 52px;
}
.w_t4_p{
    position: absolute;
    left: 0px;
    top: 680px;
    width: 100%;
    height: 52px;
}

.p1_text {
    background:url(../images/p1_text.png) center center no-repeat;
    position: absolute;
    left: 144px;
    top: 960px;
    width: 461px;
    height: 78px;
}
.p1_btn {
    background:url(../images/p1_btn.png) center center no-repeat;
    position: absolute;
    left: 214px;
    /*top: 1055px;*/
    top: 1077px;
    width: 322px;
    height: 84px;
}


.t1_w1_1 {
    background: url(../images/t1_sprites.png) center -104px no-repeat;
}
.t1_w1_1>.on {
    width: 100%;
    height: 100%;
    background: url(../images/t1_sprites.png) center -156px no-repeat!important;
}
.t1_w2_1 {
    background: url(../images/t1_sprites.png) center -208px no-repeat;
}
.t1_w2_1>.on {
    width: 100%;
    height: 100%;
    background: url(../images/t1_sprites.png) center -260px no-repeat!important;
}
.t1_w3_1 {
    background: url(../images/t1_sprites.png) center -312px no-repeat;
}
.t1_w3_1>.on {
    width: 100%;
    height: 100%;
    background: url(../images/t1_sprites.png) center -364px no-repeat!important;
}
.t1_w4_1 {
    background: url(../images/t1_sprites.png) center -0px no-repeat;
}
.t1_w4_1>.on {
    width: 100%;
    height: 100%;
    background: url(../images/t1_sprites.png) center -52px no-repeat!important;
}

.w_t2_title {
    background:url(../images/w_t2_title.png) center center no-repeat;
    position: absolute;
    left: 198px;
    top: 327px;
    width: 241px;
    height: 84px;
}

.t2_w1_1 {
    background: url(../images/t2_sprites.png) center -52px no-repeat;
}
.t2_w1_1>.on {
    background: url(../images/t2_sprites.png) center -104px no-repeat!important;
    width: 100%;
    height: 100%;
}
.t2_w2_1 {
    background: url(../images/t2_sprites.png) center -156px no-repeat;
}
.t2_w2_1>.on {
    background: url(../images/t2_sprites.png) center -208px no-repeat!important;
    width: 100%;
    height: 100%;
}
.t2_w3_1 {
    background: url(../images/t2_sprites.png) center -260px no-repeat;
}
.t2_w3_1>.on {
    background: url(../images/t2_sprites.png) center -312px no-repeat!important;
    width: 100%;
    height: 100%;
}
.t2_w4_1 {
    background: url(../images/t2_sprites.png) center -364px no-repeat;
}
.t2_w4_1>.on {
    background: url(../images/t2_sprites.png) center -0px no-repeat!important;
    width: 100%;
    height: 100%;
}
.w_t5_p{
    position: absolute;
    left: 0px;
    top: 544px;
    width: 100%;
    height: 52px;
}
.w_t6_p{
    position: absolute;
    left: 0px;
    top: 636px;
    width: 100%;
    height: 52px;
}
.w_t3_title {
    background:url(../images/w_t3_title.png) center center no-repeat;
    position: absolute;
    left: 178px;
    top: 353px;
    width: 292px;
    height: 135px;
}

.t3_w1_1 {
    background: url(../images/t3_sprites.png) center -0px no-repeat;
}
.t3_w1_1>.on {
    background: url(../images/t3_sprites.png) center -52px no-repeat;
    width: 100%;
    height: 100%;
}
.t3_w2_1 {
    background: url(../images/t3_sprites.png) center -104px no-repeat;
}
.t3_w2_1>.on {
    background: url(../images/t3_sprites.png) center -156px no-repeat;
    width: 100%;
    height: 100%;
}

.next_btn {
    background:url(../images/next_btn.png) center center no-repeat;
    position: absolute;
    left: 214px;
    /*top: 1284px;*/
    /*top: 1055px;*/
    top: 1077px;
    width: 322px;
    height: 84px;
}
.t1_ok{
    background:url(../images/t1_ok_2.png) center center no-repeat;
    position: absolute;
    left: 75px;
    top: 25px;
    width: 606px;
    height: 895px;
}
.t1_ok_1{
    background:url(../images/t1_ok_1.png) center center no-repeat;
    width: 100%;
    height: 100%;
    transform-origin: 91px 448px;
}
.t2_ok{
    background:url(../images/t2_ok_2.png) center center no-repeat;
    position: absolute;
    left: 75px;
    top: 25px;
    width: 606px;
    height: 895px;
}
.t2_ok_1{
    background:url(../images/t2_ok_1.png) center center no-repeat;
    width: 100%;
    height: 100%;
    transform-origin: 91px 448px;
}
.t3_ok{
    background:url(../images/t3_ok_2.png) center center no-repeat;
    position: absolute;
    left: 75px;
    top: 25px;
    width: 606px;
    height: 895px;
}
.t3_ok_1{
    background:url(../images/t3_ok_1.png) center center no-repeat;
    width: 100%;
    height: 100%;
    transform-origin: 91px 448px;
}
.t1_error{
    background:url(../images/t1_error.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
}
.t2_error{
    background:url(../images/t2_error.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
}
.t3_error{
    background:url(../images/t3_error.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
}
.p6_egg_bg {
    background:url(../images/p6_egg_bg.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
}
.p6_text {
    background:url(../images/p6_text.png) center center no-repeat;
    position: absolute;
    left: 95px;
    top: 960px;
    width: 559px;
    height: 62px;
}
.p6_btn,.p7_btn {
    background:url(../images/p6_btn.png) center center no-repeat;
    position: absolute;
    left: 214px;
    /*top: 1055px;*/
    top: 1077px;
    width: 322px;
    height: 84px;
}
.p7_egg_bg {
    background:url(../images/p7_egg_bg.png) center center no-repeat;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 644px;
    height: 925px;
}
.uploadimg{
    position: absolute;
    left: 241px;
    bottom: 120px;
    width: 165px;
    height: 80px;
    background: url(../images/p7_uphead.png) center center no-repeat;
}
.select_1>div.on {
    background: url(../images/select_header.png) -232px -0px no-repeat;
    width: 116px;
    height:116px;
}
.select_2>div.on {
    background: url(../images/select_header.png) -464px -0px no-repeat;
    width: 116px;
    height:116px;
}
.select_3>div.on {
    background: url(../images/select_header.png) -0px -0px no-repeat;
    width: 116px;
    height:116px;
}
.select_1 {
    position: absolute;
    left: 142px;
    top: 613px;
    width: 116px;
    height: 116px;
    background: url(../images/select_header.png) -116px -0px no-repeat;
}
.select_2 {
    position: absolute;
    left: 268px;
    top: 613px;
    width: 116px;
    height: 116px;
    background: url(../images/select_header.png) -348px -0px no-repeat;
}
.select_3 {
    position: absolute;
    left: 392px;
    top: 613px;
    width: 116px;
    height: 116px;
    background: url(../images/select_header.png) -580px -0px no-repeat;
}

.select_4 {
    position: absolute;
    left: 268px;
    top: 740px;
    width: 108px;
    height: 108px;
    border-radius: 15px;
    overflow: hidden;
    border: 4px solid #f8e11f;
    background: white;
}
.select_4>img{
    width: 100%;
    height: 100%;
}
.p8_he{
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 1580px;
    background: url(../images/he.png) center center no-repeat;
}
.p8_text {
    background:url(../images/p8_text.png) center center no-repeat;
    position: absolute;
    left: 205px;
    bottom: -65px;
    width: 337px;
    height: 78px;
}
.p8_btn {
    background:url(../images/p8_btn.png) center center no-repeat;
    position: absolute;
    left: 214px;
    bottom: -161px;
    /*top: 1277px;*/
    width: 322px;
    height: 84px;
}
#canvasHc{
    position: absolute;
    left: 0;
    top:0
}
#userhe{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
}
#wxqr,#wxqr111{
    position: absolute;
    left: 275px;
    top: 825px;
    width: 200px;
    height: 260px;
    opacity: 0;
}
.headimg{
    position: absolute;
    left: 160px;
    top: 231px;
    width: 116px;
    height: 116px;
}
.p8_he_text1{
    position: absolute;
    left: 306px;
    top:255px;
    color: #e95932;
    text-align: left;
    font-size: 26px;
    font-family: 'Microsoft Yahei';
}
.p8_he_text2{
    position: absolute;
    left: 306px;
    top: 292px;
    color: #e95932;
    text-align: left;
    font-size: 26px;
    font-family: 'Microsoft Yahei';
}






.g11 {
    background:url(../images/g11.png) center center no-repeat;
    position: absolute;
    width: 8px;
    height: 9px;
    background-size:cover;
}
.g1 {
    background:url(../images/g1.png) center center no-repeat;
    position: absolute;
    width: 66px;
    height: 59px;
    background-size:cover;
}
.g2 {
    background:url(../images/g2.png) center center no-repeat;
    position: absolute;
    width: 37px;
    height: 53px;
    background-size:cover;
}
.g3 {
    background:url(../images/g3.png) center center no-repeat;
    position: absolute;
    width: 36px;
    height: 56px;
    background-size:cover;
}
.g4 {
    background:url(../images/g4.png) center center no-repeat;
    position: absolute;
    width: 58px;
    height: 82px;
    background-size:cover;
}
.g5 {
    background:url(../images/g5.png) center center no-repeat;
    position: absolute;
    width: 59px;
    height: 70px;
    background-size:cover;
}
.g6 {
    background:url(../images/g6.png) center center no-repeat;
    position: absolute;
    width: 40px;
    height: 75px;
    background-size:cover;
}
.g7 {
    background:url(../images/g7.png) center center no-repeat;
    position: absolute;
    width: 71px;
    height: 50px;
    background-size:cover;
}
.g8 {
    background:url(../images/g8.png) center center no-repeat;
    position: absolute;
    width: 7px;
    height: 8px;
    background-size:cover;
}
.g9 {
    background:url(../images/g9.png) center center no-repeat;
    position: absolute;
    width: 7px;
    height: 8px;
    background-size:cover;
}
.g10 {
    background:url(../images/g10.png) center center no-repeat;
    position: absolute;
    width: 10px;
    height: 9px;
    background-size:cover;
}
.g12 {
    background:url(../images/g12.png) center center no-repeat;
    position: absolute;
    width: 7px;
    height: 7px;
    background-size:cover;
}


.tips_p1 {
    background: url(../images/tips_p1.png) center center no-repeat;
}
.tips_p2 {
    background: url(../images/tips_p2.png) center center no-repeat;
}
.tips_p3 {
    background: url(../images/tips_p3.png) center center no-repeat;
}
.tips_p4 {
    background: url(../images/tips_p4.png) center center no-repeat;
}
.tips_p5 {
    background: url(../images/tips_p5.png) center center no-repeat;
}

/**切割层**/
.crop_kuang{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.image-crop{
    width: 100%;
    height: 100%;
}
.crop_btn_ok{
    position: absolute;
    right: 30px;
    bottom: 50px;
    width: 322px;
    height: 84px;
    background: url(../images/crop_btn_ok.png) center center no-repeat;
}
.crop_btn_cancel {
    background:url(../images/crop_btn_cancel.png) center center no-repeat;
    position: absolute;
    left: 30px;
    bottom: 50px;
    width: 322px;
    height: 84px;
}


.audioIndex {

}
.audiocolor{
    position: absolute;
}


.audio{
    position: absolute;
    right: 5px;
    top: 5px;
    width: 100px;
    height: 100px;
	
}

.audio_on{
    background: url("../images/audio-on.png") center center no-repeat;
	background-size:55%;
}
.audio_off{
    background: url("../images/audio-off.png") center center no-repeat;
	background-size:55%;
}










.inputclass2{
    margin: 0;
    padding: 0 0 0 8px;
    border: none;
    height: 62px;
    font-size: 30px;
    line-height: 62px;
    background: none;
    color: #666666;
    /*border: 1px solid red!important;*/
    /* border-radius: 8px; */
    width: 210px;
    text-align: center;
    -webkit-user-select: auto;
    /* text-shadow: 3px 3px 3px #525252; */
    /* font-style: italic; */
    /* font-weight: bold; */
    position: absolute;
    left: 215px;
    top: 460px;
    overflow: hidden;
    font-family: "Microsoft Yahei",Tahoma,Simsun,sans-serif;
    font-weight: normal;
}

.inputclass2::-webkit-input-placeholder { /* WebKit browsers */
    color: #a6a6a6;
    font-weight: normal;
    /*font-style: italic;*/
    /*text-shadow:none;*/
}

.inputclass2::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #a6a6a6;
    font-weight: normal;
    /*font-style: italic;*/
    /*text-shadow:none;*/
}

.inputclass2:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #a6a6a6;
    font-weight: normal;
    /*font-style: italic;*/
    /*text-shadow:none;*/
}


.inputclass3{
    margin: 0;
    padding: 0 0 0 8px;
    border: none;
    height: 62px;
    font-size: 30px;
    line-height: 62px;
    background: none;
    color: #666666;
    /*border: 1px solid red!important;*/
    /* border-radius: 8px; */
    width: 210px;
    text-align: center;
    -webkit-user-select: auto;
    /* text-shadow: 3px 3px 3px #525252; */
    /* font-style: italic; */
    /* font-weight: bold; */
    position: absolute;
    left: 215px;
    top:436px;
    overflow: hidden;
    font-family: "Microsoft Yahei",Tahoma,Simsun,sans-serif;
    font-weight: normal;
}

.inputclass3::-webkit-input-placeholder { /* WebKit browsers */
    color: #a6a6a6;
    font-weight: normal;
}

.inputclass3::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #a6a6a6;
    font-weight: normal;
}

.inputclass3:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #a6a6a6;
    font-weight: normal;
}


.inputclass4{
    margin: 0;
    padding: 0 0 0 13px;
    border: none;
    position: absolute;
    height: 70px;
    font-size: 40px;
    font-family: "Noto Sans SC"; /*sans-serif;*/
    line-height: 70px;
    background: none;
    color: #fff0d7;
    /*border: 1px solid red!important;*/
    border-radius: 8px;
    width: 300px;
    text-align: center;
    -webkit-user-select: auto;
    text-shadow: 3px 3px 3px #525252;
    font-style:italic;
    font-weight: bold;
}

.inputclass4::-webkit-input-placeholder { /* WebKit browsers */
    color: #d3b38f;
    font-weight: bold;
    font-style: italic;
    text-shadow:none;
}

.inputclass4::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #d3b38f;
    font-weight: bold;
    font-style: italic;
    text-shadow:none;
}

.inputclass4:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #d3b38f;
    font-weight: bold;
    font-style: italic;
    text-shadow:none;
}

.animateSkewx1{
    -webkit-animation: moveskewx 1s linear infinite;
    animation: moveskewx 1s linear infinite;
}
@keyframes moveskewx {
    0% {
        transform: skewX(0deg);
    }
    25% {
        transform: skewX(50deg);
    }
    50% {
        transform: skewX(0deg);
    }
    75% {
        transform: skewX(-50deg);
    }
    100% {
        transform: skewX(0deg);
    }
}

.an01{
    -webkit-animation-delay: 0.1s;
}
.an02{
    -webkit-animation-delay: 0.2s;
}
.an03{
    -webkit-animation-delay: 0.3s;
}
.an04{
    -webkit-animation-delay: 0.4s;
}
.an05{
    -webkit-animation-delay: 0.5s;
}
.an06{
    -webkit-animation-delay: 0.6s;
}
.an07{
    -webkit-animation-delay: 0.7s;
}
.an08{
    -webkit-animation-delay: 0.8s;
}
.an09{
    -webkit-animation-delay: 0.9s;
}
.an10{
    -webkit-animation-delay: 1s;
}
.an11{
    -webkit-animation-delay: 1.1s;
}
.an12{
    -webkit-animation-delay: 1.2s;
}
.an13{
    -webkit-animation-delay: 1.3s;
}
.an14{
    -webkit-animation-delay: 1.4s;
}
.an15{
    -webkit-animation-delay: 1.5s;
}


::-webkit-input-placeholder { /* WebKit browsers */
    color: #000;
	font-weight: bold;
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #000;
	font-weight: bold;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #000;
	font-weight: bold;
}

.shake-hardtw{
    display: inherit;
    transform-origin: center center; }

@keyframes shake-hardtw {
    2% {
        transform: translate(0, 0) rotate(.5deg)
    }
    4% {
        transform: translate(0, 0) rotate(5.5deg)
    }
    6% {
        transform: translate(0, 0) rotate(.5deg)
    }
    8% {
        transform: translate(0, 0) rotate(-5.5deg)
    }
    10% {
        transform: translate(0, 0) rotate(.5deg)
    }
    12% {
        transform: translate(0, 0) rotate(2.5deg)
    }
    14% {
        transform: translate(0, 0) rotate(5.5deg)
    }
    16% {
        transform: translate(0, 0) rotate(-5.5deg)
    }
    18% {
        transform: translate(0, 0) rotate(-1.5deg)
    }
    20% {
        transform: translate(0, 0) rotate(4.5deg)
    }
    22% {
        transform: translate(0, 0) rotate(-6.5deg)
    }
    24% {
        transform: translate(0, 0) rotate(1.5deg)
    }
    26% {
        transform: translate(0, 0) rotate(1.5deg)
    }
    28% {
        transform: translate(0, 0) rotate(-4.5deg)
    }
    30% {
        transform: translate(0, 0) rotate(5.5deg)
    }
    32% {
        transform: translate(0, 0) rotate(2.5deg)
    }
    34% {
        transform: translate(0, 0) rotate(3.5deg)
    }
    36% {
        transform: translate(0, 0) rotate(-3.5deg)
    }
    38% {
        transform: translate(0, 0) rotate(-4.5deg)
    }
    40% {
        transform: translate(0, 0) rotate(2.5deg)
    }
    42% {
        transform: translate(0, 0) rotate(.5deg)
    }
    44% {
        transform: translate(0, 0) rotate(-3.5deg)
    }
    46% {
        transform: translate(0, 0) rotate(-4.5deg)
    }
    48% {
        transform: translate(0, 0) rotate(-1.5deg)
    }
    50% {
        transform: translate(0, 0) rotate(-3.5deg)
    }
    52% {
        transform: translate(0, 0) rotate(-2.5deg)
    }
    54% {
        transform: translate(0, 0) rotate(3.5deg)
    }
    56% {
        transform: translate(0, 0) rotate(.5deg)
    }
    58% {
        transform: translate(0, 0) rotate(-6.5deg)
    }
    60% {
        transform: translate(0, 0) rotate(-3.5deg)
    }
    62% {
        transform: translate(0, 0) rotate(-1.5deg)
    }
    64% {
        transform: translate(0, 0) rotate(3.5deg)
    }
    66% {
        transform: translate(0, 0) rotate(.5deg)
    }
    68% {
        transform: translate(0, 0) rotate(4.5deg)
    }
    70% {
        transform: translate(0, 0) rotate(1.5deg)
    }
    72% {
        transform: translate(0, 0) rotate(-3.5deg)
    }
    74% {
        transform: translate(0, 0) rotate(-3.5deg)
    }
    76% {
        transform: translate(0, 0) rotate(2.5deg)
    }
    78% {
        transform: translate(0, 0) rotate(-1.5deg)
    }
    80% {
        transform: translate(0, 0) rotate(-5.5deg)
    }
    82% {
        transform: translate(0, 0) rotate(7.5deg)
    }
    84% {
        transform: translate(0, 0) rotate(.5deg)
    }
    86% {
        transform: translate(0, 0) rotate(5.5deg)
    }
    88% {
        transform: translate(0, 0) rotate(4.5deg)
    }
    90% {
        transform: translate(0, 0) rotate(-2.5deg)
    }
    92% {
        transform: translate(0, 0) rotate(1.5deg)
    }
    94% {
        transform: translate(0, 0) rotate(-5.5deg)
    }
    96% {
        transform: translate(0, 0) rotate(7.5deg)
    }
    98% {
        transform: translate(0, 0) rotate(-3.5deg)
    }
    0%, 100% {
        transform: translate(0, 0) rotate(0)
    }

}

.shake-hardtw{
    animation-name: shake-hardtw;
    animation-duration: 100ms;
    animation-timing-function: ease-in-out;
    animation-iteration-count: 2;
    animation-play-state: running;
}
.shake-hardtw2{
    animation-name: shake-hardtw;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-play-state: running;
}


.anmiteTada {
    -webkit-animation: Tada 3s both infinite;
    -moz-animation: Tada 3s both infinite;
    -ms-animation: Tada 3s both infinite;
    animation: Tada 3s both infinite;
}

@keyframes Tada {
    0% {
        transform: scale(1);
        transform: scale(1)
    }
    19%{
        transform: scale(1);
        transform: scale(1)
    }
    20%, 23% {
        transform: scale(1) rotate(0deg);
        transform: scale(1) rotate(0deg)
    }
    27%, 33%, 40%, 47% {
        transform: scale(1) rotate(3deg);
        transform: scale(1) rotate(3deg)
    }

    30%, 37%, 43% {
        transform: scale(1) rotate(-3deg);
        transform: scale(1) rotate(-3deg)
    }
    50% {
        transform: scale(1) rotate(0deg);
        transform: scale(1) rotate(0deg)
    }

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


.animateMove1{
    -webkit-animation: animate_move1 1s linear infinite;
    animation: animate_move1 1s linear infinite;
}
@keyframes animate_move1 {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(10px);
    }
    100% {
        transform: translateY(0);
    }
}

.animateMove2{
    -webkit-animation: animate_move2 1s linear infinite;
    animation: animate_move2 1s linear infinite;
}
@keyframes animate_move2 {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
    100% {
        transform: translateY(0);
    }
}

.animateMove3{
    -webkit-animation: animate_move3 1s linear infinite;
    animation: animate_move3 1s linear infinite;
}
@keyframes animate_move3 {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
    100% {
        transform: translateY(0);
    }
}


.animateOpacity1{
    -webkit-animation: animate_opacity1 0.7s linear infinite;
    animation: animate_opacity1 0.7s linear infinite;
}
@keyframes animate_opacity1 {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

.animateOpacity113{
    -webkit-animation: animate_opacity113 1s linear infinite;
    animation: animate_opacity113 1s linear infinite;
}
@keyframes animate_opacity113 {
    0% {
        opacity: 0.9;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 0.9;
    }
}

.animateOpacity12{
    -webkit-animation: animate_opacity12 0.5s linear infinite;
    animation: animate_opacity12 0.5s linear infinite;
}
@keyframes animate_opacity12 {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.2;
    }
    100% {
        opacity: 1;
    }
}
.animateOpacity101{
    -webkit-animation: animate_opacity101 0.5s linear 3 forwards;
    animation: animate_opacity101 0.5s linear 3 forwards;
}
@keyframes animate_opacity101 {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}

.animateOpacity13{
    -webkit-animation: animate_opacity13 10s linear infinite;
    animation: animate_opacity13 10s linear infinite;
    animation-delay: 0.2s;
    -webkit-animation-delay: 0.2s;
}
@keyframes animate_opacity13 {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.6;
    }
    100% {
        opacity: 1;
    }
}

.animateScale1{
    -webkit-animation: animate_scale1 1s linear infinite;
    animation: animate_scale1 1s linear infinite;
}

@keyframes animate_scale1 {
    0% {
        transform: scale3d(1, 1, 1);
    }
    50% {
        transform: scale3d(0.9, 0.9, 1);
    }
    100% {
        transform: scale3d(1, 1, 1);
    }
}




.animateScale101{
    -webkit-animation: animate_scale101 3s linear infinite;
    animation: animate_scale101 3s linear infinite;
}

@keyframes animate_scale101 {
    0% {
        transform: scale3d(1.1,1.1, 1);
    }
    8% {
        transform: scale3d(1.2,1.2, 1);
    }
    16% {
        transform: scale3d(1.1,1.1, 1);
    }
    24% {
        transform: scale3d(1.2,1.2, 1);
    }
    32% {
        transform: scale3d(1.1,1.1, 1);
    }
    100% {
        transform: scale3d(1.1,1.1, 1);
    }
}

.animateScale2{
    animation-name:animate_scale2;
    animation-duration:0.2s;
    animation-timing-function: linear;
    animation-delay:0.2s;
    animation-iteration-count:1;
    opacity: 0;
    animation-fill-mode:forwards
}

@keyframes animate_scale2 {
    0% {
        opacity: 0;
        transform: scale3d(3, 3, 1);
    }
    100% {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

.animateScale3{
    animation-name:animate_scale3;
    animation-duration:0.3s;
    animation-timing-function: linear;
    animation-delay:1.5s;
    animation-iteration-count:1;
    transform: scale3d(0, 0, 1);
    animation-fill-mode:forwards
}

@keyframes animate_scale3 {
    0% {
        transform: rotate(30deg) scale3d(0, 0, 1);
    }
    100% {
        transform: rotate(0deg) scale3d(1, 1, 1);
    }
}





.animateRotate360{
    -webkit-animation: animate_rotate360 5s linear infinite;
    animation: animate_rotate360 5s linear infinite;
}
.animateRotate360_2{
    -webkit-animation: animate_rotate360 1s linear infinite;
    animation: animate_rotate360 1s linear infinite;
}
.animateRotate360_10{
    -webkit-animation: animate_rotate360 35s linear infinite;
    animation: animate_rotate360 35s linear infinite;
}

@keyframes animate_rotate360 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}


.animateRotate11{
    -webkit-animation: animate_rotat11 2s linear infinite;
    animation: animate_rotat11 2s linear infinite;
}
@keyframes animate_rotat11 {
    0% {
        transform: rotate(0deg);
    }
    25% {
        transform: rotate(-5deg);
    }
    50% {
        transform: rotate(0deg);
    }
    75% {
        transform: rotate(5deg);
    }
    100% {
        transform: rotate(0deg);
    }
}

.animateRotate22{
    -webkit-animation: animate_rotat22 2s linear infinite;
    animation: animate_rotat22 2s linear infinite;
}
@keyframes animate_rotat22 {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(-7deg);
    }
    100% {
        transform: rotate(0deg);
    }
}

.animateScale_gz{
    animation-name:animate_scalegz;
    animation-duration:0.2s;
    animation-timing-function: linear;
    animation-delay:0.2s;
    animation-iteration-count:1;
    opacity: 0;
    animation-fill-mode:forwards
}

@keyframes animate_scalegz {
    0% {
        opacity: 0;
        transform: scale3d(3, 3, 1);
    }
    100% {
        opacity: 1;
        transform: scale3d(1, 1, 1);
    }
}

.animateTop1{
    animation-name:animate_top1;
    animation-duration:0.8s;
    animation-timing-function: linear;
    animation-delay:0.8s;
    animation-iteration-count:1;
    animation-fill-mode:forwards
}

@keyframes animate_top1 {
    0% {
        top:-100%;
    }
    100% {
        top: 0px;
    }
}

.divc{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top:0px;
    background: #000;
    filter: alpha(opacity=0.55);
    -moz-opacity: 0.55;
    opacity: 0.55;
}
.divc2{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top:0px;
    background: #000000;
    filter: alpha(opacity=0.93);
    -moz-opacity: 0.93;
    opacity: 0.93;
}
.divc3{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top:0px;
    background: #000000;
    filter: alpha(opacity=0.8);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
.divc02{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top:0px;
    background: #000;
    filter: alpha(opacity=0.2);
    -moz-opacity: 0.2;
    opacity: 0.2;
}
.divc08{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0px;
    top:0px;
    background: #000;
    filter: alpha(opacity=0.8);
    -moz-opacity: 0.8;
    opacity: 0.8;
}
.opacity0{
    opacity: 0;
}

@keyframes shake {
    0% {
        -webkit-transform: rotate(2deg) translate3d(0,0,0)
    }
    10% {
        -webkit-transform: rotate(-2deg) translate3d(0,0,0)
    }
    20% {
        -webkit-transform: rotate(2deg) translate3d(0,0,0)
    }
    30% {
        -webkit-transform: rotate(-2deg) translate3d(0,0,0)
    }
    40% {
        -webkit-transform: rotate(0deg) translate3d(0,0,0)
    }
    100% {
        -webkit-transform: rotate(0deg) translate3d(0,0,0)
    }
}
.twlog{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    color: red;
    font-size: 24px;
}









/* Styled scrollbars */

.iScrollHorizontalScrollbar {
    position: absolute;
    z-index: 9999;
    height: 16px;
    left: 2px;
    right: 2px;
    bottom: 2px;
    overflow: hidden;
}

.iScrollHorizontalScrollbar.iScrollBothScrollbars {
    right: 18px;
}

.iScrollVerticalScrollbar {
    position: absolute;
    z-index: 9999;
    width: 12px;
    bottom: 2px;
    top: 2px;
    right: 2px;
    overflow: hidden;
}

.iScrollVerticalScrollbar.iScrollBothScrollbars {
    bottom: 18px;
}

.iScrollIndicator {
    position: absolute;
    background: #e3b091;
    border-width: 1px;
    border-style: solid;
    border-color: #e3b091;
    border-radius: 8px;
    opacity: 0.7;
}

.iScrollHorizontalScrollbar .iScrollIndicator {
    height: 100%;
    background: #e3b091;
    /*background: -moz-linear-gradient(left,  #cc3f6e 0%, #93004e 100%);*/
    /*background: -webkit-linear-gradient(left,  #cc3f6e 0%,#93004e 100%);*/
    /*background: -o-linear-gradient(left,  #cc3f6e 0%,#93004e 100%);*/
    /*background: -ms-linear-gradient(left,  #cc3f6e 0%,#93004e 100%);*/
    /*background: linear-gradient(to right,  #cc3f6e 0%,#93004e 100%);*/
}

.iScrollVerticalScrollbar .iScrollIndicator {
    width: 100%;
    background: #e3b091;
    /*background: -moz-linear-gradient(top, #cc3f6e 0%, #93004e 100%);*/
    /*background: -webkit-linear-gradient(top,  #cc3f6e 0%,#93004e 100%);*/
    /*background: -o-linear-gradient(top, #cc3f6e 0%,#93004e 100%);*/
    /*background: -ms-linear-gradient(top, #cc3f6e 0%,#93004e 100%);*/
    /*background: linear-gradient(to bottom,  #cc3f6e 0%,#93004e 100%);*/
}


/* end */