* {
    margin:0;
    padding:0;
    box-sizing:border-box;
}

@font-face {
  font-family: font-regular;
  src: url('/font/Vi-Regular.woff');
}

.portrait {
    display:none;
    background-color:#000;
    position:fixed;
    left:0;right:0;
    top:0;bottom:0;
    z-index:900;
}

    .portrait .box {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        text-align: center;
    }

    .portrait .box img {
        width: 19vw;
    }

    .portrait .box h2 {
        font-family: font-regular;
        color: #FAC802;
        font-size: 3vw;
        margin-top: 3vw;
    }

@media only screen and (min-width: 900px) {
    .portrait {
        display: block;
    }
}

.register {
    height:100%;
}

.register body {
    height:100%;
}

.register body {
    background-color: #00030d;
    background-image: url(/images/bg.jpg);
    /*background-image: url(/images/ref-reg.jpg);*/
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment:fixed;
}

    .register .logo {
        display: block;
        width: 41vw;
        margin: 4vw auto 0 auto;
    }

    .register input[type=text],
    .register input[type=number] {
        display: block;
        width: 82%;
        margin: 0 auto;
        padding: 15px;
        background-color: transparent;
        background-image: url(/images/txtbox.png);
        background-size: 100% 100%;
        background-repeat: no-repeat;
        text-align: center;
        color: #fff;
        font-size: 1em;
        border:none;
        outline:none;
        font-family: font-regular;
    }

    .register #txtName {
        margin-top: 29vw;
    }

    .register #txtMobile {
        margin-top: 3vw;
    }

    .register .btn-start {
        display: block;
        margin: 10vw auto 0 auto;
        width: 40vw;
    }

        .register .btn-start img {
            width:100%;
        }