/* CSS Document */
@charset "utf-8";

body {
    font-size: 16px;
}

/* =.top
-------------------------------------------- */
.top {
    min-height: 80px;
    min-height: 54px\9;
    background-color: #FFFFFF;
    padding-top: 20px;
}

.navbar-brand {
    padding: 0px;
    line-height: 48px;
    font-size: 24px;
}

.navbar-brand img {
    float: left;
    margin-right: 18px;
    vertical-align: middle;
}

.navbar-collapse {
    float: right !important;
}

.nav {
    padding-top: 4px;
}

.nav li a:hover,
.nav li a:active {
    background-color: transparent;
    color: #e02f25;
}

@media (min-width: 768px) {
    .top .container {
        padding-left: 0px;
        padding-right: 0px;
    }

    .nav li {
        float: left;
        margin: 0px 6px;
    }

    .nav li a {
        padding: 6px 21px;
        font-size: 15px;
        color: #444444;
    }

    .nav li a:hover,
    .nav li a:focus,
    .nav li.active a {
        background-color: #f99c41;
        border-radius: 4px;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        color: #ffffff;
        text-shadow: 0px 1px 1px #78580c;
    }
}

@media (max-width: 767px) {
    .navbar-collapse {
        float: none !important;
    }

    .navbar-brand {
        padding: 0px 15px;
        font-size: 20px;
    }

    .navbar-toggle {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .nav {
        margin: 7.5px -15px;
    }

    .nav li a {
        padding: 5px 15px;
    }
}

@media (max-width: 991px) and (min-width: 768px) {
    .nav li {
        margin: 0px 1px;
    }

    .nav li a {
        padding: 5px 15px;
    }
}

/* =.copyright
-------------------------------------------- */
.footer {
    background-color: #333333;
}

.footer .fnav {
    padding: 50px 0px 40px 0px;
    border-bottom: 1px solid #484848;
    text-align: center;
}

.footer .fnav a {
    display: inline-block;
    margin: 0 19px;
    font-size: 14px;
    color: #ffffff;
}

.copyright {
    min-height: 86px;
    line-height: 86px;
    text-align: center;
    color: #bdbdbd;
}

.copyright a {
    color: #bdbdbd;
}

.ebsgovicon {
    display: inline;
}

#scrollUp {
    background-color: #777;
    color: #eee;
    font-size: 26px;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    bottom: 20px;
    right: 20px;
    overflow: hidden;
    width: 46px;
    height: 46px;
    padding-top: 10px;
    border: none;
    opacity: .8
}

#scrollUp:hover {
    background-color: #333
}

@media screen and (min-width: 992px) {
    #scrollUp {
        bottom: 100px
    }
}

@media (max-width: 767px) {
    .copyright {
        font-size: 12px;
    }
}

/* =.Banner
-------------------------------------------- */
.banner {
    background: url(../img/banner-home-tubeget.jpg) left top no-repeat;
    background-size: cover;
    min-height: 572px;
    min-width: 100%;
    padding-top: 110px;
    color: #FFF;
}

.banner h1 {
    font-size: 58px;
    color: #d93026;
}

.banner p {
    font-size: 20px;
}

.banner .btn-block {
    display: inline-block;
    width: 190px;
    margin-right: 12px;
}

.banner .btn-block p {
    margin-top: 14px;
    font-size: 12px;
    color: #7d7d7d;
}

.banner .btn {
    width: 190px;
    height: 50px;
    margin-top: 50px;
    padding-top: 13px;
    padding-bottom: 13px;
    font-size: 14px;
    text-align: left;
}

.banner .btn-down-win {
    background: url(../img/icon-win.png) #d93026 20px center no-repeat;
    padding-left: 56px;
    color: #FFF;
}

.banner .btn-down-mac {
    background: url(../img/icon-mac.png) 36px center no-repeat;
    padding-left: 72px;
    border: 1px solid #999999;
    color: #999999;
}

.banner .btn-down-win:hover,
.banner .btn-down-win:focus,
.banner .btn-down-win:active {
    background-color: #f95248;
}

.banner .btn-down-mac:hover,
.banner .btn-down-mac:focus,
.banner .btn-down-mac:active {
    border: 1px solid #FFF;
    color: #FFF;
}

.banner .more {
    margin-top: 10px;
    display: inline-block;
    font-size: 14px;
    color: #999999;
    text-decoration: underline;
    -webkit-transition: all 0.28s ease;
    transition: all 0.28s ease;
    margin-top: 60px;
}

.product-feature {
    padding-top: 80px;
}

.product-feature .title {
    padding-bottom: 30px;
    background: url(../img/line-red.png) bottom center no-repeat;
    font-size: 36px;
    color: #f83226;
    text-align: center;
}

.product-feature .num {
    float: left;
    width: 66px;
    height: 57px;
    line-height: 57px;
    margin-right: 18px;
    padding-left: 14px;
    background: url(../img/bg-num.png) left top no-repeat;
    font-size: 23px;
    color: #FFF;
}

.product-feature-1 {
    padding-top: 20px;
    padding-bottom: 56px;
}

.product-feature-1 .product-feature-content {
    padding-left: 80px;
}

.product-feature-2 {
    border: 1px solid #ededed;
    padding-top: 90px;
    padding-bottom: 106px;
}

.product-feature-2 .img-responsive {
    margin-left: auto;
    margin-right: auto;
}

.product-feature .product-feature-head {
    margin-top: 62px;
}

.product-feature .product-feature-head h3 {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 24px;
    color: #333333;
}

.product-feature .product-feature-head p {
    font-size: 18px;
}

.product-feature .product-feature-content {
    padding-top: 40px;
}

.product-feature .product-feature-content p {
    margin-bottom: 30px;
    font-size: 14px;
}

.product-desc-step {
    padding-top: 70px;
    padding-bottom: 110px;
    background: url(../img/bg-product-action.jpg) left top repeat-x;
    text-align: center;
}

.product-desc-step .title {
    margin-bottom: 20px;
    font-size: 36px;
    color: #333333;
}

.product-desc-step .title span {
    color: #f83226;
}

.product-desc-step p {
    margin: 22px 0px;
    line-height: 22px;
    font-size: 16px;
}

.product-desc-step .product-action {
    padding-top: 60px;
}

.product-action-step {
    position: relative;
    padding-right: 52px;
}

.product-action-step .product-action-desc {
    display: block;
    font-size: 16px;
    margin: 14px auto;
}

.product-action-progress {
    position: absolute;
    top: 96px;
    right: -124px;
}

/* =.supprt-page
-------------------------------------------- */
.supprt-page {
    background: url(../img/bg-contact-us.jpg) left top repeat-x;
    padding-top: 20px;
    padding-bottom: 20px;
}

.contact-us {
    padding-top: 70px;
    padding-bottom: 170px;
    background: url(../img/img-contact-us.jpg) 90% 90% no-repeat;
}

.about,
.privacy,
.agreement,
.parsing-failure {
    padding-top: 60px;
    padding-bottom: 80px;
}

.contact-us h1,
.about h1,
.privacy h1,
.agreement h1,
.parsing-failure h1 {
    margin-bottom: 38px;
    font-size: 32px;
    color: #ef2b1f;
}

.privacy h2,
.agreement h2,
.parsing-failure h2 {
    font-weight: bold;
    font-size: 15px;
    color: #333333;
}

.contact-us p,
.about p,
.privacy p,
.agreement p {
    margin-bottom: 30px;
}

.privacy dl dt {
    font-weight: normal;
    margin-bottom: 20px;
}

.contact-us .comment-form .title {
    margin-bottom: 28px;
    font-size: 24px;
    color: #ef2b1f;
}

.contact-us .comment-form .form-control {
    border-radius: 0;
}

.contact-us .comment-form .btn {
    width: 146px;
    height: 44px;
    margin-right: 18px;
}

.contact-us .comment-form .btn-submit {
    background-color: #f83226;
    border-radius: 0;
    color: #FFF;
}

.contact-us .comment-form .btn-submit:hover,
.contact-us .comment-form .btn-submit:active {
    background-color: #ff453a;
}

.contact-us .comment-form .btn-reset {
    background-color: #b5b5b5;
    border-radius: 0;
    color: #FFF;
}

.contact-us .comment-form .btn-reset:hover,
.contact-us .comment-form .btn-reset:active {
    background-color: #939393;
}

.nav-support-tab {
    width: 40%;
}

.contact-us .registrationCode,
.contact-us .subscriptionCode {
    width: 60%;
    min-height: 130px;
    padding: 34px 26px;
    margin-bottom: 20px;
    border: 1px solid #fafafa;
}

.contact-us .registrationCode form,
.contact-us .subscriptionCode form {
    width: 60%;
}

.contact-us .registrationCode .title,
.contact-us .subscriptionCode .title {
    margin-top: 0px;
    font-size: 30px;
    font-weight: bold;
}

.contact-us .registrationCode p,
.contact-us .subscriptionCode p {
    margin-top: 14px;
    margin-bottom: 10px;
}

/* =.Page Content
-------------------------------------------- */
.tutorial-page,
.tutorial-list,
.pay-success,
.confirm-purchase,
.purchase,
.purchase-selectd,
.purchase-container,
.account-center {
    padding-top: 40px;
    padding-bottom: 100px;
    border-top: 3px solid #ef2b1f;
    background-color: #fafafa;
}

.purchase-container {
    padding-top: 0px;
    padding-bottom: 20px;
}

.purchase {
    padding-bottom: 60px;
}

.breadcrumb {
    padding-left: 0;
    padding-right: 0;
    margin-left: -15px;
    margin-right: -15px;
    background: none;
}

.tutorial-list .main-content,
.tutorial-page .main-content {
    background-color: #fcfcfc;
    -webkit-box-shadow: 4px 20px 30px 8px #f2f2f2;
    -moz-box-shadow: 4px 20px 30px 8px #f2f2f2;
    box-shadow: 4px 20px 30px 8px #f2f2f2;
}

.tutorial-page .content,
.tutorial-list .content {
    padding: 30px 46px 40px 46px;
    background-color: #FFF;
}

.tutorial-list h1 {
    margin-bottom: 30px;
    text-align: center;
    font-size: 30px;
    color: #ef2b1f;
}

.page-section {
    border-bottom: 1px solid #d9d9d9;
    padding: 5px 0px 20px 0px;
    margin-bottom: 20px;
}

.page-section h2 {
    margin-top: 0px;
}

.page-section h2 a {
    font-size: 18px;
    color: #333333;
}

.page-section h2 a:hover,
.page-section h2 a:active {
    color: #ef2b1f;
}

.wp-pagenavi {
    margin-top: 30px;
    text-align: right;
}

.tutorial-page h1 {
    margin-bottom: 30px;
    font-size: 24px;
    color: #333333;
}

.tutorial-page p {
    margin-bottom: 30px;
}

.tutorial-page dl {
    margin-bottom: 40px;
    padding-left: 18px;
    border-left: 2px solid #ef2b1f;
}

.tutorial-page .comment-form {
    padding-top: 30px;
    border-top: 1px solid #d9d9d9;
}

.tutorial-page .comment-form .title {
    margin-bottom: 28px;
    font-size: 24px;
    color: #ef2b1f;
}

.tutorial-page .comment-form .form-control {
    border-radius: 0;
}

.tutorial-page .comment-form .btn {
    width: 146px;
    height: 44px;
    margin-right: 18px;
}

.tutorial-page .comment-form .btn-submit {
    background-color: #f83226;
    border-radius: 0;
    color: #FFF;
}

.tutorial-page .comment-form .btn-submit:hover,
.tutorial-page .comment-form .btn-submit:active {
    background-color: #ff453a;
}

.content,
.sidebar {
    float: left;
    position: relative;
    min-height: 1px;
}

.content {
    float: left;
    width: 72%;
}

.sidebar {
    float: right;
    width: 28%;
}

/* =.Sidebar
-------------------------------------------- */
.sidebar .widget {
    margin-bottom: 28px;
    padding: 48px 32px;
}

.sidebar h3 {
    margin-top: 0;
    margin-bottom: 30px;
    font-size: 20px;
    color: #ef2b1f;
}

.sidebar .hot-topics ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
}

.sidebar .hot-topics ul li {
    background: url(../img/icon-arrow-red.png) 0px 3px no-repeat;
    padding-left: 18px;
    margin-bottom: 18px;
}

.sidebar .hot-topics ul li a {
    color: #444444;
    font-size: 14px;
    line-height: 20px;
}

/* =.purchase
-------------------------------------------- */
.purchase dl {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 30px;
}

.purchase .purchase-main {
    position: relative;
    margin-top: 70px;
    margin-bottom: 40px;
    background-color: #ffffff;
    -webkit-box-shadow: 4px 20px 30px 8px #f2f2f2;
    -moz-box-shadow: 4px 20px 30px 8px #f2f2f2;
    box-shadow: 4px 20px 30px 8px #f2f2f2;
}

.purchase .purchase-main .btn-proxy {
    position: absolute;
    right: 96px;
    top: -32px;
    padding-left: 36px;
    background: url(../img/icon-hand.png) left center no-repeat;
    font-size: 16px;
    color: #e02f25;
    text-decoration: underline;
}

.purchase .purchase-main .btn-proxy:hover,
.purchase .purchase-main .btn-proxy:active {
    color: #f53429;
}

.purchase h1,
.purchase-container h1 {
    text-align: center;
    font-size: 32px;
    color: #333333;
}

.purchase .btn {
    width: 202px;
    height: 54px;
    margin-bottom: 12px;
    padding-top: 16px;
    padding-bottom: 14px;
    font-size: 14px;
    text-align: center;
}

.purchase h2 {
    margin-top: 50px;
    text-align: center;
    font-size: 30px;
}

.purchase h2 small {
    display: block;
    margin-top: 10px;
    font-size: 58%;
    color: inherit;
}

.purchase .price {
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
    font-size: 24px;
    color: #e02f25;
}

.purchase .col-xs-4 {
    padding-left: 0;
    padding-right: 0;
    text-align: center;
}

.purchase .btn-buy {
    background: url(../img/buy.svg) 62px center no-repeat;
    border: 1px solid #e02f25;
    padding-left: 56px;
    color: #e02f25;
}

.purchase .btn-down-win {
    background: url(../img/icon-win-purchase.png) 62px center no-repeat;
    border: 1px solid #e02f25;
    padding-left: 56px;
    color: #e02f25;
}

.purchase .btn-down-mac {
    background: url(../img/icon-mac-purchase.png) 62px center no-repeat;
    padding-left: 56px;
    border: 1px solid #333333;
    color: #333333;
}

.purchase .btn-buy:hover,
.purchase .btn-buy:focus,
.purchase .btn-buy:active,
.purchase .btn-down-win:hover,
.purchase .btn-down-win:focus,
.purchase .btn-down-win:active {
    border-color: #ff4f45;
    color: #ff4f45;
}

.purchase .btn-down-mac:hover,
.purchase .btn-down-mac:focus,
.purchase .btn-down-mac:active {
    border: 1px solid #717171;
    color: #717171;
}

.purchase .purchase-main-center {
    position: absolute;
    /*top: -26px;*/
    left: 33.33333333%;
    /*min-height: 836px;*/
    background-color: #FFF;
    -webkit-box-shadow: 4px 20px 30px 8px #f2f2f2;
    -moz-box-shadow: 4px 20px 30px 8px #f2f2f2;
    box-shadow: 4px 20px 30px 8px #f2f2f2;
}

.purchase .purchase-main-right {
    float: right;
}

.purchase .upgrade-support {
    /*padding-top: 50px;*/
    padding-bottom: 10px;
}

.purchase .upgrade-support dl {
    /*	float: left;*/
    /*padding-right: 50px;*/
    margin-bottom: 0;
    /*width: 33.33333333%;*/
    width: 100%;
    text-align: left;
}

.purchase .upgrade-support dl dt {
    margin-bottom: 20px;
    text-align: center;
    font-size: 24px;
    color: red;
}

.purchase .upgrade-support dl dd {
    margin-left: 43px;
    margin-bottom: 10px;
    color: #8c8a8a;
}

.purchase .upgrade-support .num {
    display: inline-block;
    padding: 3px 6px;
    margin-right: 14px;
    background-color: #e02f25;
    color: #FFF;
    border-radius: 2px;
}

.system-requirements {
    padding: 40px 0px;
    margin-bottom: 0;
}

.system-requirements dt {
    margin-bottom: 14px;
    font-size: 16px;
    color: #333333;
}

.system-requirements dd {
    margin-bottom: 8px;
    font-size: 14px;
}

.purchase ul {
    border-top: 1px solid #d9d9d9;
    list-style: none;
    text-align: left;
    margin-top: 30px;
    padding: 36px 40px;
}

.purchase ul li {
    margin-bottom: 20px;
    padding-left: 36px;
}

.purchase ul li.right-purchase-1 {
    background: url(../img/icon-right-purchase-1.png) left center no-repeat;
}

.purchase ul li.right-purchase-2 {
    background: url(../img/icon-right-purchase-2.png) left center no-repeat;
    color: #888888;
}

.purchase-selectd .container {
    position: relative;
    background-color: #fefefe;
    -webkit-box-shadow: 4px 20px 30px 8px #f2f2f2;
    -moz-box-shadow: 4px 20px 30px 8px #f2f2f2;
    box-shadow: 4px 20px 30px 8px #f2f2f2;
    border-top: 3px solid #d1d1d1;
}

.purchase-selectd .purchase-progress {
    width: 100%;
    list-style: none;
    padding: 0;
    margin: -3px -15px 0px -15px;
}

.purchase-selectd .purchase-progress li {
    position: relative;
    float: left;
    width: 33.33333333%;
    min-height: 78px;
    line-height: 78px;
    text-align: center;
}

.purchase-selectd .purchase-progress li span {
    position: absolute;
    top: -18px;
    left: 45%;
    display: block;
    width: 29px;
    height: 29px;
    line-height: 29px;
    color: #FFF;
    background: url(../img/bg-num-purchase.png) left top no-repeat;
}

.purchase-selectd .purchase-progress li.active {
    border-top: 3px solid #f83226;
    color: #f83226;
    font-weight: bold;
}

.purchase-selectd .purchase-progress li.active span {
    background: url(../img/bg-num-purchase-active.png) left top no-repeat;
}

.purchase-selectd .price,
.purchase-selectd .total-price {
    color: red;
}

.purchase-selectd table {
    margin-bottom: 0;
}

.purchase-selectd table tr td {
    vertical-align: middle;
    padding-top: 20px;
    padding-bottom: 20px;
}

.purchase-selectd .product-num {
    width: 36px;
    height: 36px;
    padding: 0;
    float: left;
    text-align: center;
}

.purchase-selectd .jian,
.purchase-selectd .jia {
    display: block;
    float: left;
    width: 36px;
    height: 36px;
    line-height: 32px;
    background-color: #f7f7f7;
    border: 1px solid #d1d1d1;
    text-align: center;
    font-size: 24px;
    cursor: pointer;
}

.purchase-selectd .jian {
    border-right: none;
}

.purchase-selectd .jia {
    border-left: none;
}

.purchase-selectd .jian:hover,
.purchase-selectd .jian:active,
.purchase-selectd .jia:hover,
.purchase-selectd .jia:active {
    background-color: #eeeeee;
}

.purchase-selectd .purchase-email,
.purchase-selectd .invoice-info {
    padding: 0px 15px 22px;
}

.purchase-selectd .purchase-email .text-right,
.purchase-selectd .invoice-info .text-right {
    vertical-align: middle;
    line-height: 30px;
}

.purchase-selectd .purchase-email .col-xs-5,
.purchase-selectd .purchase-email .col-xs-7 {
    padding-right: 0;
}

.purchase-selectd .purchase-email .form-control {
    border-radius: 0;
}

.purchase-selectd .invoice-block {
    border-bottom: 1px solid #ddd;
    margin-bottom: 20px;
}

.purchase-step .invoice-block {
    border-top: 1px solid #e0e0e0;
    padding-bottom: 20px;
    padding-top: 20px;
    margin-top: 14px;
}

.purchase-selectd .invoice-block,
.purchase-selectd .invoice-info,
.purchase-step .invoice-block,
.purchase-step .invoice-info {
    display: none;
}

.purchase-selectd .btn-settlement {
    background-color: #f83226;
    width: 170px;
    height: 52px;
    border-radius: 0;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    padding-top: 12px;
}

.purchase-selectd .btn-settlement:hover,
.purchase-selectd .btn-settlement:focus,
.purchase-selectd .btn-settlement:active {
    background-color: #fe5a50;
}

.purchase-support {
    min-height: 148px;
    margin-top: 60px;
    padding: 48px 46px 20px 46px;
    background-color: #fafafa;
}

.purchase-support .safe,
.purchase-support .support,
.purchase-support .service {
    min-height: 60px;
}

.purchase-support .safe {
    background: url(../img/icon-safe.png) 0px 0px no-repeat;
    padding-left: 58px;
}

.purchase-support .support {
    background: url(../img/icon-support.png) 0px 0px no-repeat;
    padding-left: 54px;
}

.purchase-support .service {
    background: url(../img/icon-service.png) 0px 0px no-repeat;
    padding-left: 74px;
    padding-right: 0;
}

.confirm-purchase .container {
    width: 748px;
    min-height: 750px;
    border-top: 2px solid #ef2b1f;
    background-color: #fefefe;
}

.confirm-purchase h1 {
    margin-top: 40px;
    margin-bottom: 20px;
    font-size: 32px;
    color: #ef2b1f;
    text-align: center;
}

.confirm-purchase .product {
    margin-left: 20px;
    margin-right: 20px;
    padding: 20px 10px;
    line-height: 60px;
    background-color: #FFF;
    border: 1px solid #d9d9d9;
}

.confirm-purchase .product .product-box {
    float: left;
    width: 20%;
}

.confirm-purchase .product .product-box .img-responsive {
    margin-left: auto;
    margin-right: auto;
}

.confirm-purchase .product .product-name {
    float: left;
    width: 70%;
}

.confirm-purchase .product .product-num {
    float: left;
    width: 10%;
}

.confirm-purchase .total-price {
    padding: 20px;
    text-align: right;
}

.confirm-purchase .total-price .price {
    color: #ef2b1f;
}

.confirm-purchase .wechat-pay {
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}

.confirm-purchase .wechat-pay .img-responsive {
    margin-left: auto;
    margin-right: auto;
}

.pay-success .container {
    width: 548px;
    min-height: 676px;
    padding-top: 124px;
    position: relative;
    background-color: #fcfcfc;
    -webkit-box-shadow: 4px 20px 30px 8px #f2f2f2;
    -moz-box-shadow: 4px 20px 30px 8px #f2f2f2;
    box-shadow: 4px 20px 30px 8px #f2f2f2;
    text-align: center;
}

.pay-success .img-responsive {
    margin-left: auto;
    margin-right: auto;
}

.pay-success h1 {
    margin-top: 50px;
    font-size: 30px;
    color: #333333;
}

.pay-success .return-page {
    position: absolute;
    bottom: 30px;
    left: 0;
    right: 0;
    text-align: center;
}

.proxy {
    padding-top: 60px;
    padding-bottom: 100px;
    border-top: 3px solid #ef2b1f;
    background-color: #fafafa;
}

.proxy h1 {
    margin-bottom: 40px;
    text-align: center;
    font-size: 32px;
    color: #333333;
}

.proxy .container {
    padding-left: 0;
    padding-right: 0;
    background-color: #FFFFFF;
    -webkit-box-shadow: 4px 20px 30px 8px #f2f2f2;
    -moz-box-shadow: 4px 20px 30px 8px #f2f2f2;
    box-shadow: 4px 20px 30px 8px #f2f2f2;
}

.proxy-url {
    padding: 50px 66px;
    border-bottom: 1px solid #e3e3e3;
}

.proxy-url p {
    margin-bottom: 20px;
    font-size: 18px;
    color: #e02f25;
}

.proxy-url .form-control {
    background-color: #fafafa;
}

.proxy-url .form-control:focus {
    background-color: #FFFFFF;
}

.proxy-url .btn-submit {
    display: block;
    width: 268px;
    height: 51px;
    margin: 40px auto 0 auto;
    border-radius: 0;
    background-color: #e02f25;
    font-size: 18px;
    color: #FFF;
}

.proxy-url .btn-submit:hover,
.proxy-url .btn-submit:active {
    background-color: #f53227;
}

.proxy dl {
    margin: 0;
    padding: 32px 56px;
    background-color: #fcfcfc;
}

.proxy dl dt {
    margin-bottom: 14px;
    font-weight: normal;
    font-size: 18px;
    color: #e02f25;
}

.proxy dl dd {
    margin-bottom: 12px;
    font-size: 16px;
    color: #333333;
}

.proxy-action {
    padding: 40px 56px;
}

.proxy-action h2 {
    margin-bottom: 40px;
    font-weight: bold;
    font-size: 22px;
    color: #e02f25;
}

.proxy-action-step {
    position: relative;
    float: left;
    width: 20%;
    text-align: center;
}

.proxy-action-progress {
    position: absolute;
    top: 22px;
    right: -48px;
}

.proxy-action-desc {
    margin: 22px 0px;
}

.proxy-action-desc span {
    color: #0e3ca7;
}

.proxy-settlement {
    min-height: 116px;
    line-height: 116px;
    border-top: 1px solid #d9d9d9;
    border-bottom: 1px solid #d9d9d9;
    background-color: #FFF;
    margin-bottom: 40px;
    text-align: center;
    font-size: 18px;
}

.proxy-settlement span {
    font-weight: bold;
    color: #f83226;
}

.proxy-pay {
    width: 90%;
    min-height: 130px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 30px;
    border: 1px solid #d9d9d9;
    background-color: #FFF;
    text-align: center;
    font-size: 16px;
}

.proxy-pay p {
    margin-bottom: 20px;
}

.proxy-pay span {
    font-weight: bold;
    color: #ef2b1f;
}

.activation-untying .container {
    width: 780px;
    padding-top: 110px;
    padding-bottom: 150px;
}

.activation-untying .title {
    margin-bottom: 20px;
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    color: #ef2b1f;
}

.activation-untying-main {
    width: 520px;
    margin: 0 auto;
    padding-bottom: 80px;
}

.activation-untying dl dt {
    margin-bottom: 20px;
    font-size: 18px;
    font-weight: bold;
    color: #ef2b1f;
}

.activation-untying dl dd {
    margin-bottom: 10px;
}

.activation-untying dl dd a {
    color: #ef2b1f;
    text-decoration: underline;
}

.activation-untying .form-horizontal {
    margin-top: 58px;
}

.activation-untying .input-group-addon {
    height: 42px;
    border-radius: 0;
    padding: 8px 0px 8px 16px;
}

.activation-untying .form-control {
    border-left: none;
    border-radius: 0;
    height: 42px;
    padding-left: 8px;
}

.activation-untying .query-key {
    padding-left: 0;
    padding-right: 0;
    line-height: 42px;
}

.activation-untying .captcha {
    padding-left: 0;
    padding-right: 0;
}

.activation-untying .btn-submit {
    width: 168px;
    height: 46px;
    margin: 35px 0px 0px 126px;
    background-color: #0f9b45;
    border: none;
    border-radius: 0;
    font-weight: bold;
    font-size: 18px;
    color: #FFF;
}

.activation-untying .btn-submit:hover,
.activation-untying .btn-submit:active {
    background-color: #0ebe52;
}

/* =.Reviews
-------------------------------------------- */
.form-reviews {
    margin: 40px 0px;
}

.form-reviews a {
    display: inline-block;
    margin-left: 12px;
    font-size: 18px;
    color: #0584c3;
    text-decoration: underline;
}

.form-reviews a:hover,
.form-reviews a:active {
    color: #0d99de;
}

.btn-reviews {
    color: #FFFFFF;
    background-color: #b6cb34;
    border-color: #b0c52b;
    margin-right: 12px;
    font-size: 18px;
}

.btn-reviews:hover,
.btn-reviews:focus,
.btn-reviews.focus,
.btn-reviews:active,
.btn-reviews.active {
    color: #FFFFFF;
    background-color: #c7da53;
    border-color: #bbcf40;
}

.btn-reviews:active,
.btn-reviews.active {
    background-image: none;
}

.btn-reviews.disabled,
.btn-reviews[disabled],
fieldset[disabled] .btn-reviews,
.btn-reviews.disabled:hover,
.btn-reviews[disabled]:hover,
fieldset[disabled] .btn-reviews:hover,
.btn-reviews.disabled:focus,
.btn-reviews[disabled]:focus,
fieldset[disabled] .btn-reviews:focus,
.btn-reviews.disabled.focus,
.btn-reviews[disabled].focus,
fieldset[disabled] .btn-reviews.focus,
.btn-reviews.disabled:active,
.btn-reviews[disabled]:active,
fieldset[disabled] .btn-reviews:active,
.btn-reviews.disabled.active,
.btn-reviews[disabled].active,
fieldset[disabled] .btn-reviews.active {
    background-color: #ffffff;
    border-color: #cccccc;
}

.reviews-item {
    position: relative;
    width: 100%;
    padding: 1em 1.5em;
    margin: 2em auto;
    color: #444444;
    line-height: 24px;
    background-color: #f7f7f7;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
    box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.3);
    z-index: 9998;
}

.reviews-item p {
    margin: 0;
}

.reviews-item p+p {
    margin: 1.5em 0 0;
}

.reviews-item .reviews-name {
    float: right;
}

.text-red {
    color: red;
}

.text-blue {
    color: dodgerblue;
}

/* =.pay-page
-------------------------------------------- */
.purchase-container .nav-pay {
    margin-bottom: 30px;
}

.purchase-container .nav-pay {
    border-bottom: 1px solid #ececec;
}

.purchase-container .nav-pay>li>a {
    margin-bottom: -1px;
    color: #000;
    font-size: 18px;
    text-shadow: none;
}

.purchase-container .nav-pay>li>a:hover,
.purchase-container .nav-pay>li>a:focus {
    text-shadow: none;
    background-color: transparent;
    border: 1px solid transparent;
    /* border-bottom: 4px solid #ef2b1f; */
    color: #ef2b1f;
}

.purchase-container .nav-pay>li.active>a,
.purchase-container .nav-pay>li.active>a:hover,
.purchase-container .nav-pay>li.active>a:focus {
    text-shadow: none;
    background-color: transparent;
    border: 1px solid transparent;
    border-bottom: 4px solid #ef2b1f;
}

.purchase-container .nav-purchase {
    height: 66px;
    border: none;
}

.purchase-container .nav-purchase>li {
    width: 50%;
    margin: 0;
    padding: 0;
    height: 66px;
    text-align: center;
    border: none;
}

.purchase-container .nav-purchase>li>a {
    padding: 9.5px 15px;
    margin: 0px;
    font-size: 18px;
    color: #000;
    background-color: #ececec;
}

.purchase-container .nav-purchase>li span {
    display: block;
    font-size: 14px;
    color: #95999f;
}

.purchase-container .nav-purchase>li.purchase>a {
    border-right: none;
    border-bottom: none;
    border-top: 1px solid #ececec;
    border-left: 1px solid #ececec;
    border-radius: 0px;
}

.purchase-container .nav-purchase>li.lifetime>a {
    border-left: none;
    border-bottom: none;
    border-top: 1px solid #ececec;
    border-right: 1px solid #ececec;
    border-radius: 0px;
}

/* .purchase-container .nav-purchase>li>a:hover, */
.purchase-container .nav-purchase>li>a:focus,
.purchase-container .nav-purchase>li.active>a,
/* .purchase-container .nav-purchase>li.active>a:hover, */
.purchase-container .nav-purchase>li.active>a:focus {
    text-shadow: none;
    background-color: #fafafa;
}

.purchase-step {
    padding-top: 20px;
    /* padding-bottom: 20px; */
}

.product-select {
    border: 1px solid #ececec;
    border-top: none;
    padding: 40px 50px 22px 50px;
}

.purchase-step .row {
    margin: 0;
}

.purchase-step .title {
    height: 54px;
    line-height: 52px;
    margin-bottom: 42px;
    font-size: 18px;
    border-bottom: 1px solid #e0e0e0;
}

.purchase-step .title.first {
    margin-bottom: 20px;
}


.pay-select .pay-select-time-num {
    float: left;
    width: 22%;
    margin-right: 40px;
    position: relative;
    cursor: pointer;
    text-align: center;
}

.pay-select .pay-select-time-num.last {
    margin-right: 0px;
}

.pay-select .itme-hour {
    height: 46px;
    line-height: 46px;
    font-size: 18px;
    margin: 0px;
    text-align: center;
    border: 1px solid #fa9826;
    background-color: #fa9826;
    border-radius: 6px 6px 0px 0px;
    color: #FFF;
}

.pay-select .item-box {
    border: 1px solid #CCCCCC;
    background-color: #FFF;
    border-radius: 0px 0px 6px 6px;
}

.pay-select .pay-select-time-num:hover .item-box,
.pay-select .pay-select-time-num.active .item-box {
    background-color: #faeee1;
    border-color: #fa9826;
}

.pay-select .pay-select-time-num:hover .tips,
.pay-select .pay-select-time-num.active .tips {
    background-color: #F9A825;
    color: #FFF;
}

.pay-select .pay-select-time-num .discount {
    position: absolute;
    top: -17px;
    right: 10px;
    background-color: #ed0f01;
    color: #FFF;
    font-size: 18px;
    width: 60px;
    height: 28px;
    line-height: 28px;
    border-radius: 4px;
}

.pay-select .itme-tips {
    position: absolute;
    left: 0px;
    top: -10px;
    width: 70px;
    height: 18px;
    width: 7rem;
    height: 1.8rem;
    line-height: 18px;
    line-height: 1.8rem;
    text-align: center;
    background-color: #fa9826;
    font-size: 10px;
    color: #FFF;
    border-radius: 10px 0px 10px 0px;
}

.pay-select .itme-price {
    margin: 12px 0px 0px 0px;
    font-size: 36px;
    text-align: center;
    color: #E60000;
}

.pay-select .itme-old-price {
    color: #b2b2b2;
    font-size: 24px;
    text-decoration: line-through;
}

.pay-select .itme-days {
    font-size: 18px;
    margin-bottom: 16px;
}

.pay-select .tips {
    display: inline-block;
    padding: 0px 18px;
    height: 36px;
    line-height: 36px;
    margin: 0 auto 22px auto;
    border-radius: 32px;
    background-color: #FFEBCC;
    font-size: 18px;
}

.purchase-step dl,
.benefits-list {
    margin: 40px 0px 0px 0px;
}



.purchase-step dl dt,
.benefits-list dt {
    font-size: 22px;
    color: #000;
    margin-bottom: 20px;
}

.purchase-step dl dd,
.benefits-list dd {
    width: 50%;
    float: left;
    font-size: 18px;
    background: url(../img/icon-right-purchase-1.png) left center no-repeat;
    margin-bottom: 20px;
    padding-left: 36px;
}

.purchase-step dl dd span,
.benefits-list dd span {
    color: #4fa2e3;
}

.purchase-step .product-num {
    width: 36px;
    height: 36px;
    padding: 0;
    text-align: center;
    vertical-align: middle;
}

.purchase-step .pay-select-num .text {
    display: inline-block;
    float: left;
    height: 36px;
    line-height: 36px;
}

.purchase-step .total-num {
    display: inline-block;
    float: left;
    margin-left: 30px;
    line-height: 36px;
    color: #fa9725;
    vertical-align: middle;
}

.purchase-step .jian,
.purchase-step .jia {
    display: inline-block;
    width: 36px;
    height: 36px;
    line-height: 32px;
    background-color: #f7f7f7;
    border: 1px solid #d1d1d1;
    text-align: center;
    font-size: 24px;
    cursor: pointer;
    vertical-align: middle
}

.purchase-step .jian {
    margin-left: 20px;
    border-right: none;
}

.purchase-step .jia {
    border-left: none;
}

.purchase-step .jian:hover,
.purchase-step .jian:active,
.purchase-step .jia:hover,
.purchase-step .jia:active {
    background-color: #eeeeee;
}

#total_price {
    margin-left: 20px;
}

.purchase-account .form-horizontal .control-label {
    float: left;
    width: 14%;
    font-size: 16px;
    padding-right: 8px;
}

.purchase-account .form-horizontal .control-label-input {
    float: left;
    width: 24%;
    margin-right: 20px;
}

.purchase-account .form-horizontal .form-control {
    font-size: 15px;
    height: 40px;
}

.purchase-account .form-horizontal .tips {
    line-height: 40px;
}

.purchase-step .pay-platform {
    min-width: 170px;
    margin-left: 24px;
    vertical-align: bottom;
}

.purchase-step .checkbox label {
    padding-left: 0;
}

.purchase-step .pay-method {
    display: -webkit-flex;
    -webkit-align-items: flex-start;
    display: flex;
    align-items: center;
}

.purchase-step .license {
    margin-top: 20px;
    color: #808080;
}

.pay-settlement {
    padding-top: 30px;
}

.checkboxStyle {
    position: relative;
}

.checkboxStyle input[type="radio"],
.checkboxStyle input[type="checkbox"] {
    opacity: 0;
}

.checkboxStyle input[type="radio"]+label::before {
    content: '';
    position: absolute;
    left: 0px;
    top: 16px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1px solid #999;
}

.checkboxStyle input[type="radio"]:checked+label::before {
    content: '';
    background-color: #349EDF;
    border: 1px solid #349EDF;
}

.checkboxStyle input[type="radio"]:checked+label::after {
    position: absolute;
    content: "";
    width: 5px;
    height: 8px;
    top: 18px;
    left: 5px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg)
}

.checkboxStyle input[type="checkbox"]+label {
    margin-left: 10px;
}

.checkboxStyle input[type="checkbox"]+label::before {
    content: '';
    position: absolute;
    left: 0px;
    top: 4px;
    width: 14px;
    height: 14px;
    border: 1px solid #999;
}

.checkboxStyle input[type="checkbox"]:checked+label::before {
    content: '';
    background-color: #349EDF;
    border: 1px solid #349EDF;
}

.checkboxStyle input[type="checkbox"]:checked+label::after {
    position: absolute;
    content: "";
    width: 5px;
    height: 8px;
    top: 5px;
    left: 5px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg)
}

.btn-settlement {
    width: 180px;
    height: 50px;
    line-height: 40px;
    color: #FFF;
    font-size: 18px;
}

.purchase-step .btn-settlement,
.user-center .btn-settlement {
    background-color: #f83226;
    width: 170px;
    height: 52px;
    border-radius: 0;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    padding-top: 4px;
}

.purchase-step .btn-settlement:hover,
.purchase-step .btn-settlement:focus,
.purchase-step .btn-settlement:active,
.user-center .btn-settlement:hover,
.user-center .btn-settlement:focus,
.user-center .btn-settlement:active {
    background-color: #fe5a50;
}

.purchase-container .upgrade-support {
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid #ececec;
    padding-bottom: 10px;
}

.purchase-container .upgrade-support dl {
    margin-bottom: 0;
    width: 100%;
}

.purchase-container .upgrade-support dl dt {
    margin-bottom: 20px;
    font-size: 24px;
    text-align: center;
}

.purchase-container .upgrade-support dl dd {
    margin-bottom: 10px;
    color: #8c8a8a;
}

.purchase-container .upgrade-support .num {
    display: inline-block;
    padding: 3px 6px;
    margin-right: 14px;
    background-color: #e02f25;
    color: #FFF;
    border-radius: 2px;
}

.page-pay-success,
.page-pay,
.login-page,
.reset-page,
.restore-page,
.register-page {
    max-width: 600px;
    margin: 100px auto 140px auto;
    padding-bottom: 40px;
    border: 1px solid #e0e0e0;
    text-align: center;
    color: #000000;
    position: relative;
}

.page-pay-success h1,
.page-pay h1,
.login-page h1,
.reset-page h1,
.restore-page h1,
.register-page h1 {
    height: 100px;
    line-height: 100px;
    border-bottom: 1px solid #e0e0e0;
    margin: 0;
    font-size: 30px;
}

.page-pay .total-price {
    margin-top: 32px;
    margin-bottom: 32px;
    font-size: 36px;
    color: #fa9725;
}

.page-pay .wechat-pay {
    margin-bottom: 30px;
}

.page-pay-success .img-responsive {
    margin: 88px auto 66px auto;
}

.page-pay-success p,
.loginform {
    padding-left: 96px;
    padding-right: 96px;
    text-align: left;
}

.resetform {
    padding-left: 55px;
    padding-right: 55px;
    text-align: left;
}

.page-pay-success p .to-email {
    color: #337ab7;
}

.promotion {
    position: absolute;
    width: 598px;
    height: 426px;
    bottom: 0px;
    left: 0px;
    background: url(../img/bg-promotion-success.jpg) left top no-repeat;
    background-size: cover;
    color: #FFF;
    font-size: 72px;
    text-align: center;
    padding-top: 100px;
}

.promotion p {
    text-align: center;
    padding-left: 0;
    padding-right: 0;
}

.promotion .close {
    width: 36px;
    height: 36px;
    cursor: pointer;
    background: url(../img/btn-promotion-close.png) left top no-repeat;
    text-indent: -999999px;
    font-size: 0px;
    position: absolute;
    right: 14px;
    top: 14px;
    border: none;
}

.promotion .close:hover,
.promotion .close:active {
    border: none;
    opacity: .8;
}




/* =.account
-------------------------------------------- */
.sendCodeError {
    background: url(../img/icon_error.png) left center no-repeat;
    color: red;
    padding-left: 22px;
    margin-top: 5px;
    margin-bottom: 24px;
    margin-left: 15px;
    font-size: 14px;
    text-align: left;
}

.sendCodeError.success {
    background: url(../img/icon_yes.png) left center no-repeat;
    color: #009844;
}

.invite-users {
    margin: 30px auto 40px auto;
}

.invite-users-banner {
    background: url(../img/bg-invite-banner.jpg) left top no-repeat;
    background-size: contain;
    color: #FFF;
    height: 400px;
    padding-left: 104px;
    padding-top: 60px;
}

.invite-users-banner input[type="text"] {
    border: none;
    background: url(../img/bg-invite-input.png) left top no-repeat;
    box-shadow: none;
    border-radius: none;
    width: 426px;
    height: 40px;
    padding: 6px 20px;
    font-size: 18px;
    color: #FFF;
    margin: 14px 0px 20px 0px;
}

.invite-users-banner ul {
    padding-left: 18px;
}

.invite-users-banner ul li {
    font-size: 18px;
    line-height: 36px;
}

.invite-users-banner .btn-copy {
    width: 160px;
    height: 45px;
    line-height: 30px;
    color: #FFF;
    font-size: 18px;
    border-radius: 8px;
    background-color: #fa9725;
}

.invite-users-banner .btn-copy:hover,
.invite-users-banner .btn-copy:active {
    background-color: #da8019;
    border-color: #da8019;
    color: #FFF;
}

.invite-main {
    padding: 0px 146px;
}

.invite-tips {
    background-color: #fff59d;
    height: 100px;
    margin-top: 80px;
    border: 1px solid #ddd;
}

.step-invite {
    position: relative;
    min-height: 140px;
    margin-top: 24px;
    margin-bottom: 50px;
    text-align: center;
}

.step-invite .step-desc {
    margin-top: 1.6rem;
    margin-bottom: 1rem;
    color: #00a0e8;
    font-size: 18px;
    text-align: center;
}

.step-invite .position-relative {
    position: relative;
    width: 88px;
    height: 88px;
    margin-left: auto;
    margin-right: auto;
    z-index: 9;
}

.step-invite .first .position-relative {
    margin-left: 0;
}

.step-invite .first .step-desc {
    text-align: left;
}

.step-invite .last .position-relative {
    margin-right: 0;
}

.step-invite .last .step-desc {
    text-align: right;
}

.step-invite::after {
    position: absolute;
    height: 1px;
    width: 100%;
    top: 32%;
    left: 42px;
    background: url(../img/line-invite.png) left top no-repeat;
}

.invite-users .table tr td {
    padding: 14px 42px;
    text-align: center;
}

.invite-users .table thead tr td {
    background-color: #00a0e8;
    font-size: 24px;
    color: #FFF;
}

.invite-users .table tfoot tr td {
    background-color: #fff59d;
}




.loginform,
.resetform {
    padding-top: 66px;
    padding-bottom: 10px;
}

.loginform .form-group,
.resetform .form-group {
    margin-bottom: 30px;
}

.loginform label,
.resetform label {
    font-size: 16px;
    color: #808080;
}

.resetform p {
    font-size: 16px;
    color: #808080;
    margin-bottom: 34px;
    margin-left: 12px;
}

.restoreform .control-label,
.resetform .control-label {
    padding-left: 0px;
    padding-right: 0px;
    font-size: 16px;
}

.restoreStep,
.restoreform {
    position: relative;
    padding-left: 96px;
    padding-right: 96px;
}

.restoreStep {
    min-height: 146px;
    padding-top: 44px;
    z-index: 999;
}

.restoreStep .step {
    width: 33.33%;
    float: left;
    font-size: 16px;
}

.restoreStep::after {
    position: absolute;
    display: block;
    content: "";
    height: 0;
    border-top: 1px solid #e0e0e0;
    width: 46%;
    left: 26%;
    top: 57px;
    z-index: 1;
}

.restore-page span {
    position: relative;
    display: block;
    width: 24px;
    height: 24px;
    margin: 0 auto 8px auto;
    font-size: 14px;
    color: #242424;
    line-height: 19px;
    border-radius: 50%;
    background-color: #e0e0e0;
    border: 2px solid transparent;
    z-index: 999;
}

.restore-page span::before {
    content: '';
    position: absolute;
    display: block;
    width: 26px;
    height: 26px;
    top: -3px;
    left: -3px;
    border-radius: 50%;
    border: 1px solid transparent;
}

.restore-page .active span {
    color: #FFF;
    background-color: #00a0e8;
    border-color: #FFF;
}

.restore-page .active span::before {
    border-color: #00a0e8;
}

.restoreform .form-group {
    margin-left: 0;
    margin-right: 0;
    padding-left: 15px;
    padding-right: 15px;
}

.restoreform .get-code-col {
    padding-left: 0;
    padding-right: 0;
}

.restoreform .btn-get-code {
    border-radius: 0;
    margin-left: 10px;
    color: #FFF;
    background-color: #00a0e8;
}

.restoreform .btn-get-code:hover,
.restoreform .btn-get-code:active {
    background-color: #1ab4f9;
}

/* .restoreform .btn-get-code {
	border-radius: 0;
	margin-left: 20px;
	height: 60px;
	width: 90%;
	color: #00a0e8;
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: #fff;
} */

.loginform .button-primary,
.resetform .button-primary,
.restore-page .button-primary,
.restoreform .button-next {
    background-color: #00a0e8;
    color: #FFF;
    width: 100%;
    padding: 8px 16px;
    border-radius: 0;
}

.loginform .button-primary:hover,
.loginform .button-primary:active,
.resetform .button-primary:hover,
.resetform .button-primary:active,
.restore-page .button-primary:hover,
.restore-page .button-primary:active,
.restoreform .button-next:hover,
.restoreform .button-next:active {
    background-color: #1ab4f9;
    border-color: #1ab4f9;
}

.resetform .button-primary {
    display: block;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

.restoreform .button-next {
    width: 100%;
}

.restoreform .img-success {
    margin: 20px auto;
}

.restoreform .restoreform-success {
    font-size: 24px;
}

#logo {
    background: url("../img/bg-login.png");
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-width: 1000px;
    z-index: -10;
    zoom: 1;
    background-color: #fff;
    background-repeat: no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
    background-position: center 0;
}

#logo .top {
    background-color: transparent;
    border: none;
    color: #FFF;
}

#logo .navbar-default .navbar-brand {
    height: 44px;
    line-height: 44px;
    color: #FFF;
}

#logo .navbar-default .navbar-brand img {
    width: 44px;
    height: 44px;
}

#logo .footer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: transparent;
    color: #FFF;
    padding-bottom: 30px;
}

#logo .footer a {
    color: #FFF;
}

.login {}

.login-box {
    right: 0px;
    top: 80px;
    width: 480px;
    height: 600px;
    background: rgba(255, 255, 255, .85);
    border-radius: 8px;
    padding: 12px;
}

.email-login,
.phone-login,
.phone-register,
.email-register {
    padding: 38px 36px 10px 36px;
    position: relative;
}

.wx-login,
.wx-register {
    padding: 38px 10px 38px 10px;
    text-align: center;
}

.wx-login ul,
.wx-register ul,
.email-login ul,
.phone-login ul,
.email-register ul,
.phone-register ul {
    list-style: none;
    margin: 0px;
    padding: 0;
}

.email-login ul,
.phone-login ul,
.phone-register ul,
.email-register ul {
    margin-bottom: 48px;
}

.wx-login ul li,
.wx-register ul li,
.email-login ul li,
.phone-login ul li,
.email-register ul li,
.phone-register ul li {
    display: inline-block;
    width: 33.33%;
    float: left;
    text-align: center;
}

.email-login ul li,
.phone-login ul li {
    text-align: left;
}


.email-login ul li.active,
.phone-login ul li.active,
.email-register ul li.active,
.phone-register ul li.active {
    font-weight: bold;
}

.email-register ul.ul-bottom li,
.wx-register ul.ul-bottom li,
.phone-login ul.ul-bottom li,
.email-login ul.ul-bottom li,
.wx-login ul.ul-bottom li {
    width: 50%;
    text-align: left;
}

.phone-login ul.ul-bottom li.last,
.email-login ul.ul-bottom li.last,
.wx-login ul.ul-bottom li.last,
.email-register ul.ul-bottom li.last,
.wx-register ul.ul-bottom li.last {
    text-align: right;
}

.wx-login .title,
.wx-register .title,
.email-login .title,
.phone-login .title,
.email-register .title,
.phone-register .title {
    font-size: 36px;
    margin-bottom: 44px;
    text-align: center;
}

.email-login .form-control::-moz-placeholder {
    text-align: center;
}

.email-login .form-control:-ms-input-placeholder {
    text-align: center;
}

.email-login .form-control::-webkit-input-placeholder {
    text-align: center;
}

.wx-login .img-qr,
.wx-register .img-qr {
    width: 264px;
    height: 264px;
    margin: 0 auto;
}


.wx-login span,
.wx-register span,
.email-login span,
.phone-login span,
.email-register span,
.phone-register span {
    cursor: pointer;
}

.login-tips {
    width: 264px;
    height: 56px;
    margin: 24px auto 40px auto;
    line-height: 56px;
    background-color: #09BB07;
    font-size: 18px;
    color: #FFF;
    padding: 0px 12px;
}

.login-tips.active {
    width: 100%;
    text-align: center;
    background: none;
    color: #000000;
    font-size: 16px;
    padding: 0;
}

.login-tips img {
    display: inline-block;
    margin-right: 14px;
}

.link {
    color: #3573DE;
    cursor: pointer;
}

.register-text {
    margin-top: -10px;
}

.phone-register ul li,
.email-register ul li {
    display: inline-block;
    width: 40%;
    float: left;
    text-align: left;
}

.phoneloginform .send-code-col,
.emailloginform .send-code-col,
.phone-register .send-code-col,
.email-register .send-code-col {
    margin-bottom: 48px;
}

.phoneloginform .send-code-col.send-code-btn,
.emailloginform .send-code-col.send-code-btn,
.phone-register .send-code-col.send-code-btn,
.email-register .send-code-col.send-code-btn {
    margin-bottom: 20px;
}

.phoneloginform .form-control,
.emailloginform .form-control,
.phone-register .form-control,
.email-register .form-control {
    background: rgba(255, 255, 255, 1);
    border-color: #b3b3b3;
    height: 64px;
    font-size: 18px;
    border-radius: 8px;
}

.btn-code {
    padding: 0px 0px 0px 8px;
}

.btn-phoneregister-code,
.btn-phoneregister-code:hover,
.btn-phoneregister-code:active {
    background: rgba(255, 255, 255, 1);
    border-color: #b3b3b3;
    height: 64px;
    font-size: 18px;
    border-radius: 8px;
    color: #3573DE;
}

.btn-phoneregister-code:hover,
.btn-phoneregister-code:active {
    background: rgba(219 219 219, 1);
}

.btn-phoneregister-submit {
    background-color: #3573de;
    color: #FFF;
    width: 100%;
    font-size: 18px;
    height: 64px;
}

.btn-phoneregister-submit:hover,
.btn-phoneregister-submit:active {
    background-color: #3d7ff0;
    color: #FFF;
}

#login_container iframe {
    height: 264px;
}


/* =.account
-------------------------------------------- */
.account-center {
    padding-top: 40px;
    padding-bottom: 40px;
}

.account-center .account-pay {
    margin-bottom: 30px;
}

.account-center .nav-account {
    position: relative;
    float: left;
    width: 144px;
    height: auto;
    margin-right: 24px;
    background-color: #F5F7FA;
    border-radius: 8px;
    padding: 40px 0px;
}

.account-center .nav-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.account-center .nav-list li {
    height: 36px;
    line-height: 36px;
    margin-bottom: 10px;
    font-size: 18px;
    text-align: center;
}

.account-center .nav-list li a {
    color: #000000;
    text-decoration: none;
}

.account-center .nav-list li:hover a,
.account-center .nav-list li:active a,
.account-center .nav-list li.active a {
    color: #3573DE;
}

.user-center {
    max-width: 1000px;
    min-width: 1000px;
    float: right;
}

.user-center .user-center-main {
    margin-bottom: 24px;
    padding: 0px 48px 36px 48px;
    border: 1px solid #CCCCCC;
    border-radius: 8px;
}

.user-center .account-top {
    padding: 36px 0px 46px 0px;
    background: url(../img/line-account-top.png) left bottom no-repeat;
}

.user-center .head {
    float: left;
    width: 80%;
}

.user-center .head .head-img {
    float: left;
    width: 96px;
    height: 96px;
    margin-right: 20px;
    vertical-align: middle;
}

.user-center .head .head-img img {
    border-radius: 50%;
    display: block;
    max-width: 100%;
}

.user-center .head .head-name {
    float: left;
    padding-top: 8px;
}

.user-center .head .head-name .vip {
    display: inline-block;
    width: 30px;
    height: 12px;
    background: url(../img/icon-vip.png);
    text-indent: -99999px;
    margin-left: 12px;
    vertical-align: middle;
}

.user-center .head .head-name .novip {
    display: inline-block;
    width: 30px;
    height: 12px;
    background: url(../img/icon-free.png);
    text-indent: -99999px;
    margin-left: 12px;
    vertical-align: middle;
}


.user-center .head .head-name p,
.user-center .device p {
    margin-bottom: 0px;
    margin-top: 8px;
}

.user-center .head .head-name p {
    display: block;
    overflow: hidden;
}

.user-center .logout {
    float: left;
    width: 20%;
}

.user-center .logout .btn-quit {
    border: 1px solid #707070;
    border-radius: 8px;
    width: 150px;
    /* height: 48px; */
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 18px;
    color: #333;
}

.user-center .head h1 {
    margin-top: 0px;
    font-size: 26px;
}

.user-center-main ul {
    list-style: none;
    margin: 0px 0px 48px 0px;
    padding: 36px 0px 16px 0px;
    background: url(../img/line-account-bottom.png) left bottom no-repeat;
}

.user-center-main ul li {
    float: left;
    width: 50%;
    padding-left: 38px;
    margin-bottom: 20px;
    line-height: 25px;
    background: url(../img/yes-user-center.svg) 0px 0px no-repeat;
}

.download-center .btn-download,
.user-center .btn-download {
    background-color: #0099ff;
    width: 88%;
    color: #FFF;
    font-size: 18px;
    padding: 18px 18px;
}

.download-center .btn-download:hover,
.download-center .btn-download:active,
.user-center .btn-download:hover,
.user-center .btn-download:active {
    background-color: #23a5fc;
}

.user-center .btn-renew {
    background-color: #F9AA2B;
    color: #FFF;
    font-size: 18px;
    padding: 10px 18px;
    width: 100%;
}

.user-center .btn-renew:hover,
.user-center .btn-renew:active {
    background-color: #da8019;
    border-color: #da8019;
}



.request-invoice .invoice-title {
    border-bottom: 1px solid #e0e0e0;
}

.request-invoice h1 {
    display: inline-block;
    padding: 14px 24px;
    margin: 0px 0px -1px 0px;
    border-bottom: 4px solid #00a0e8;
    font-size: 18px;
    font-weight: bold;
    color: #232323;
}

.invoice-step {
    padding: 36px 0px 0px 4px;
    margin: 0px 0px;
}

.invoice-step .form-horizontal {
    width: 50%;
}

.invoice-step .title {
    margin-bottom: 50px;
    font-size: 18px;
    padding-bottom: 14px;
    color: #232323;
    border-bottom: 1px solid #e0e0e0;
}

.invoice-step .invoice-info {
    padding: 10px 0px;
}

.invoice-step .pay-method {
    display: -webkit-flex;
    -webkit-align-items: flex-start;
    display: flex;
    align-items: center;
}


.invoice-step .pay-platform {
    min-width: 170px;
    margin-left: 24px;
    vertical-align: bottom;
}

.invoice-step .checkbox label {
    padding-left: 0;
}

.invoice-step .pay-method {
    display: -webkit-flex;
    -webkit-align-items: flex-start;
    display: flex;
    align-items: center;
}

.invoice-step .license {
    margin-top: 40px;
    color: #808080;
}

.pay-settlement {
    padding-top: 14px;
    border: none;
}

.explain {
    margin-top: 50px;
    padding-top: 20px;
    border-top: 1px solid #e0e0e0;
    color: #808080;
}

.explain span {
    color: #fa9725;
}





@media (max-width: 991px) {
    .banner {
        text-align: center;
        padding-top: 50px;
    }

    .banner h1 {
        font-size: 38px;
    }

    .banner .btn {
        margin-top: 30px;
    }

    .product-action-progress {
        position: static;
    }

    .purchase .purchase-main-left,
    .purchase .purchase-main-right,
    .purchase .purchase-main-center {
        width: 100%;
        float: none;
    }

    .purchase .purchase-main-center {
        position: static;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .system-requirements {
        padding: 40px 15px;
    }

    .contact-us {
        padding: 0px;
        background: none;
    }

    .contact-us .registrationCode,
    .contact-us .subscriptionCode {
        width: 100%;
        padding-left: 0px;
        padding-right: 0px;
    }

    .contact-us .registrationCode form,
    .contact-us .subscriptionCode form {
        width: 100%;
    }

    .content,
    .sidebar {
        float: none;
        width: 100%;
    }

    .tutorial-page .content,
    .tutorial-list .content {
        padding: 15px;
    }

    .wp-pagenavi {
        text-align: center;
    }

    .breadcrumb {
        padding: 8px 15px;
    }

    .tutorial-list .main-content img,
    .tutorial-page .main-content img {
        display: block;
        max-width: 100%;
        height: auto;
    }

    .footer .fnav a {
        margin: 0px 10px;
    }

    .banner .more {
        margin-top: 30px;
    }

}











/* =.Content Container
-------------------------------------------- */
.product-feature-head:before,
.product-feature-head:after,
.product:before,
.product:after,
.purchase-main:before,
.purchase-main:after,
.purchase-progress:before,
.purchase-progress:after,
.proxy-action:before,
.proxy-action:after,
.invoice-info:before,
.invoice-info:after,
.purchase-email:before,
.purchase-email:after,
.upgrade-support:before,
.upgrade-support:after,
.account-top::before,
.account-top::after,
.user-center-main ul::before,
.user-center-main ul::after,
.purchase-step dl::after,
.purchase-step dl::before,
.benefits-list::before,
.benefits-list::after {
    display: table;
    content: " ";
}

.product-feature-head:after,
.product:after,
.purchase-main:after,
.purchase-progress:after,
.proxy-action:after,
.invoice-info:after,
.purchase-email:after,
.upgrade-support:after,
.account-top::after,
.user-center-main ul::after,
.purchase-step dl::after,
.benefits-list::after {
    clear: both;
}

/* =.Multi Dimension
-------------------------------------------- */
@media (max-width: 479px) {}

@media (min-width: 480px) {}

@media (max-width: 767px) {}

@media (min-width: 768px) {}

@media (max-width: 991px) {}

@media (min-width: 992px) {}

@media (max-width: 1199px) {}

@media (min-width: 1200px) {}

@media (min-width: 480px) and (max-width: 767px) {}

@media (min-width: 768px) and (max-width: 991px) {}

@media (min-width: 992px) and (max-width: 1199px) {}