﻿.bj-login{
    position: absolute;
    top:0;
    left:0;
    z-index: -1;
    width: 100%;
}
.hd{
    width: 100%; height: auto;overflow: hidden ;position:relative;
    /*background: #8dc0b7;
    background: -moz-linear-gradient(-45deg,rgba(141,192,183,1) 0,rgba(78,96,161,1) 100%);
    background: -webkit-gradient(linear,left top,right bottom,color-stop(0,rgba(141,192,183,1)),color-stop(100%,rgba(78,96,161,1)));
    background: -webkit-linear-gradient(-45deg,rgba(141,192,183,1) 0,rgba(78,96,161,1) 100%);
    background: -o-linear-gradient(-45deg,rgba(141,192,183,1) 0,rgba(78,96,161,1) 100%);
    background: -ms-linear-gradient(-45deg,rgba(141,192,183,1) 0,rgba(78,96,161,1) 100%);
    background: linear-gradient(135deg,rgba(141,192,183,1) 0,rgba(78,96,161,1) 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#8dc0b7', endColorstr='#4e60a1', GradientType=1);*/}
.hd>div{z-index:1;}
.hd .cnt{width: 100%; margin: 15% auto 0px;}
.hd .btm{width: 100%;}
.hd .form{width: 280px; border-radius: 30px; margin: 0 auto 10px; background: #ffffff; overflow:hidden;
    box-shadow: 0 0 30px 1px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 0 30px 1px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0 0 30px 1px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0 0 30px 1px rgba(0, 0, 0, 0.3); -o-box-shadow: 0 0 30px 1px rgba(0, 0, 0, 0.3);
    -webkit-animation-name: bounceInDown;
    animation-name: bounceInDown;
    -moz-box-sizing: border-box;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    box-sizing:border-box;
    display:block;
}
.hd .form .hd-form-head-image{width:83px; height:112px;margin:20px auto;background:url("login.png")}
.hd .form .ttl{width: 220px; margin: 10px auto;  text-align: center;  font-size:21px;color:rgba(24,75,97,.9);}
.hd .form .row{width: 220px; margin: 0 auto 10px;}
.hd .form>div{
    animation: fadeInDown 1.2s .1s ease-out both;
    -webkit-animation: fadeInDown 1.2s .1s ease-out both;
    -moz-animation: fadeInDown 1.2s .1s ease-out both;
}
.hd .form .row-last{height:32px;}
.hd .form .row .footer-row-forget-img{display:inline-block;width:15px;height:16px;background:url("caifu_img.png") repeat scroll -36px 0}
.hd .form .row .footer-row-check-net{display:inline-block;width:15px;height:16px;background:url("caifu_img.png") repeat scroll -36px -20px}
.hd .form .row .long{width: 220px;}
.hd .form .row .short{width: 130px;  float:left; display:block;}
.hd .form .row .code{width: 82px; height: 32px; margin-left: 8px; border-radius: 20px; float: left; border: none;display:block;}
.hd .form .row .btn{color:#fff;font-size:14px;border-radius: 25px; width: 220px; height: 32px; display: block; background: #1394da; border: none; cursor: pointer;  outline:none;}
.hd .form .row .btn:hover{background:#0088ff;}
.hd .form .row .login_ipt {height: 32px;line-height: 32px;font-size:12px; background: rgb(240, 240, 240) none repeat scroll 0 0; border: medium none; border-radius: 30px; text-align: center; outline:none; }
.error_div{color:#49c280;font-size:12px;text-align: center;}
.helpinfo{font-size:12px;color:#9FFF61;}
.row .row-ps{float:left; color:#999; text-indent:17px; margin:6px 1px; line-height:22px;}
.row .row-ps span:last-child{display:inline-block;margin-left:5px;height:15px; text-indent:0px; color: #999;}
.row .row-ps span:last-child:hover{color: #32b9ec;}
.row a{text-decoration: none;}


.footer{ width:300%; overflow:hidden; border:none;height: auto; margin: 50px 0; position:relative;color:white;}
.footer .footer-box{ width:33.3%; float: left;}
.footer .footer-box .footer-row{ margin:0 auto; width: 324px;height:auto;text-align:center;}
.footer .footer-box .footer-row .footer-row-header{height:30px;width:263px;margin:0 auto;}
.footer .footer-box .footer-row .footer-row-header#footer-row-header-game{background:url("login.png") repeat scroll -84px -57px}
.footer .footer-box .footer-row .footer-row-header#footer-row-header-pay{background:url("login.png") repeat scroll -84px 0px}
.footer .footer-box .footer-row .footer-row-header#footer-row-header-safe{background:url("login.png") repeat scroll -84px -27px}
/*.footer .footer-box .footer-row .footer-row-header div{ float: left;}
.footer .footer-box .footer-row .footer-row-header-text{ font-size:25px; line-height:25px;}
.footer .footer-box .footer-row .footer-row-header-line{ width:2px;height:33px;margin: 0 5px;background: url("../../images/login.png") repeat scroll -277px 0}
.footer .footer-box .footer-row .footer-row-header-detail p{font-size:12px; line-height:12px;text-align:left;}
.footer .footer-box .footer-row .footer-row-header-detail p:last-child{ margin-top:2px;}*/
.footer .footer-box .footer-row .footer-row-footer{margin-top:20px;}
.footer .footer-box .footer-row .footer-row-footer-sub{float:left;margin-left:30px;}
.footer .footer-box .footer-row .footer-row-footer-sub:first-child{margin-left:0px;}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img{width:88px;height:92px;}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-ag-funny{background: url("login.png") repeat scroll -84px -308px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-pt-tiger{background: url("login.png") repeat scroll -172px -308px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-cf-mmc{background: url("login.png") repeat scroll -260px -308px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-web-chart{background: url("login.png") repeat scroll -84px -90px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-aliy-pay{background: url("login.png") repeat scroll -172px -90px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-30-bank{background: url("login.png") repeat scroll -260px -90px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-first-cagayan{background: url("login.png") repeat scroll -84px -199px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-gam-care{background: url("login.png") repeat scroll -172px -199px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-img#footer-data-safe{background: url("login.png") repeat scroll -260px -199px}
.footer .footer-box .footer-row .footer-row-footer-sub .footer-row-footer-sub-text{color:rgba(255,255,255,.5)}

.btm {width:960px;color:white;text-align:left;margin-bottom:10px;}
.btm .btm1{width:960px;color:white;text-align:left;margin-left:25%}

.bottom {width:100%; color:white;margin-bottom:10px;}
/*下面width:500px是下端的宽度设置，设置太大链接总体偏左，实时调试*/
.bottom .bottom-header{width:295px;margin:0 auto;height:20px;}
.bottom .bottom-header>div{float:left;font-size: 14px; }
.bottom .bottom-header .bottom-header-img-domain{width:20px;height:20px;background:url(caifu_img.png) repeat scroll -33px -60px;}
.bottom .bottom-header .bottom-header-img-verify{width:20px;height:20px;background:url(caifu_img.png) repeat scroll -33px -80px;}
.bottom .bottom-header .bottom-header-img-confirm{width:20px;height:20px;background:url(caifu_img.png) repeat scroll -33px -40px;}
.bottom .bottom-header .bottom-header-text{margin-left:5px;line-height: 16px;}
.bottom .bottom-header .bottom-header-text a{text-decoration: none;color: #fff;}
.bottom .bottom-header .bottom-header-text a:hover{color: rgba(255,255,255,0.5);}
.bottom .bottom-header .bottom-header-line{margin: 0 10px;line-height: 16px;}
.bottom .bottom-footer{margin:0 auto;font-size: 12px; width:360px;text-align:center;}
@-webkit-keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
@-webkit-keyframes bounceInDown {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    }

    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);
    }

    to {
        -webkit-transform: none;
        transform: none;
    }
}

@keyframes bounceInDown {
    from, 60%, 75%, 90%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
        animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    }

    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);
    }

    to {
        -webkit-transform: none;
        transform: none;
    }
}