body {
    font-family: open sans, helvetica neue, Helvetica, Arial, sans-serif;
    color: #333;
}

a {
    color: #247aff;
}

.pagination > .active > a {
    background-color: #247aff;
}

.pagination > li > a {
    color: #247aff;
}

p {
    font-size: 15px;
}

h2 {
    font-size: 26px;
}

h3 {
    font-size: 22px;
}

h4 {
    font-size: 18px;
}

ul {
    margin: 0;
    padding: 0;
}

ol {
    padding-left: 20px;
}

@font-face {
    font-family: "iconfont";
    src: url("/media/static/fonts/iconfont.eot?t=1519886544336");
    src: url("/media/static/fonts/iconfont.eot?t=1519886544336#iefix") format("embedded-opentype"), url("/media/static/fonts/iconfont.svg?t=1519886544336#iconfont") format("svg");
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-facebook::before {
    content: "\e77a";
}

.icon-twitter::before {
    content: "\ecb3";
}

.icon-iphone::before {
    content: "\e62e";
}

.icon-windows::before {
    content: "\e7fb";
}

.icon-chrome::before {
    content: "\e66d";
}

.icon-android::before {
    content: "\e640";
}

.icon-ipad::before {
    content: "\e617";
}

.icon-right::before {
    content: "\e6b8";
}

.icon-safari::before {
    content: "\e7ee";
}

.icon-mac::before {
    content: "\e61b";
}

.icon-google-play::before {
    content: "\e78c";
}

.icon-ipad1::before {
    content: "\e664";
}

.icon-youtube::before {
    content: "\e6bd";
}

.icon-firefox::before {
    content: "\e693";
}

#dashboard-activation-code .form-control {
    max-width: 260px;
}

#setup {
    padding-bottom: 60px;
}

#setup .page-title {
    font-size: 26px;
}

#redfinger-phone canvas {
    background: none !important;
}

#netdelay {
    font-size: 12px;
    text-align: center;
    padding: 0;
    margin-top: 10px;
}

.redfinger-command {
    color: #fff;
    display: block;
    text-align: center;
    -webkit-tap-highlight-color: none;
    padding: 11.5px 0;
}

body.modal-open {
    user-select: none;
    -webkit-user-select: none;
    position: fixed;
    width: 100%;
}

body.body-play-open {
    position: fixed;
    width: 100%;
}

#bottom-btns {
    height: 35px;
    padding: 6.5px 0;
    position: absolute;
    z-index: 10000;
    background: rgba(52, 52, 52, .85);
    text-align: center;
    touch-action: manipulation;
}

#bottom-btns.horizontal {
    width: 35px !important;
    padding-right: 0 !important;
    padding-top: 35px !important;
    display: flex;
    flex-flow: column;
    justify-content: center;
    align-items: center;
}

#bottom-btns > a {
    display: inline-block;
    margin: 0 35px;
    padding: 0;
    height: 17px;
}

#bottom-btns.horizontal > a {
    margin: 35px 0;
}

#right-btns {
    background: rgba(52, 52, 52, .96);
    position: fixed;

    /* right: 0px; */
    top: 0;
    bottom: 0;
    width: 35px;
    font-size: 12px;
    color: #fff;
    touch-action: manipulation;
}

#right-btns .quit-pro {
    margin-top: 10px;
}

#right-btns.horizontal {
    height: 35px;
}

#right-btns.horizontal .func-action {
    float: left;
    margin: 0;
    height: 29px;
    margin-top: 3px;
    width: auto;
    display: block;
    position: relative;
    bottom: 0;
}

#right-btns.horizontal .quit-pro {
    margin-left: 10px;
}

#right-btns.horizontal #netdelay {
    float: left;
    width: 50px;
    margin: 0 6px;
    line-height: 35px;
}

#right-btns.horizontal .bottom {
    float: right;
}

#right-btns.horizontal .icon-quit {
    margin-top: 0;
}

#right-btns.horizontal #netdelay br {
    display: none;
}

#right-btns.horizontal .func-action li {
    float: left;
    margin: 0 5px 0;
}

.mybox {
    margin: 10px 0;
    border-radius: 4px;
    padding: 20px 0;
    height: 130px;
    box-shadow: 2px 4px 8px 0 #ddd;
    border: 1px #eee solid;
    cursor: pointer;
}

.mybox:hover {
    box-shadow: 2px 4px 8px 0 #eee;
}

#login-history-items .mybox {
    display: flex;
    align-items: center;
}

#restart-task .mybox .row {
    margin: 0;
    width: 100%;
    display: flex;
    align-items: center;
}

#restart-task .mybox .repeat {
    padding: 0 15px;
}

#restart-task .mybox .time {
    font-size: 25px;
    text-align: center;
}

#restart-task .dropdown-menu {
    right: 0;
    left: auto;
}

#restart-task .dropdown-menu > li {
    border-bottom: none;
}

#login-history-items .device {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

#login-history-items .info {
    padding-left: 0;
}

#login-history-items .text-muted {
    color: #bdbdbd;
}

#login-history-items .glyphicon-menu-right {
    color: #9b9b9b;
}

#login-info-detail {
    /* position: fixed; */
    width: 360px;
    background: #fff;

    /* border: 1px #ccc solid; */
    z-index: 9999;
    padding: 20px;
    margin: 20px auto;
}

#login-history .detail-header {
    color: #247aff;
    cursor: pointer;
}

#login-info-detail .title {
    color: #bcc3d0;
    text-align: left;
    padding-left: 0;
}

#login-info-detail .value {
    color: #434343;
    text-align: right;
    padding-right: 0;
    word-break: break-all;
}

#login-info-detail > .row {
    padding: 10px 0;
    border-bottom: 1px #eee solid;
    margin: 0;
}

#login-info-detail .header {
    text-align: center;
    font-weight: bold;
    font-size: 14px;
    margin-bottom: 25px;
}

.action-icon {
    background: url("/media/static/images/play-icons.png?_=20200104") no-repeat;
    width: 17px;
    height: 17px;
    display: inline-block;
    background-size: 159.5px 45.5px;
    background-position: 0 0;
}

.myicon {
    background: url("/media/static/images/play-icons.png?_=20200104") no-repeat;
    width: 22px;
    height: 22px;
    display: inline-block;
    background-size: 319px 91px;
    background-position: 0 0;
    cursor: pointer;
}

.myicon-switch {
    background-position: -256px -64.5px;
}

.icon-login-type-web,
.icon-login-type-android,
.icon-login-type-ios,
.icon-login-type-win {
    width: 26px;
    height: 26px;
    background-size: 319px 91px;
    background-position: -102px 0;
}

.icon-login-type-web {
    background-position: -180px 0;
}

.icon-login-type-ios {
    background-position: -128px 0;
}

.icon-login-type-win {
    background-position: -154px 0;
}

.icon-quit-pro {
    background-position-x: -174.5px;
}

.icon-volume-up {
    background-position-x: -116px;
}

.icon-resize-1x {
    background-position-x: -261px;
}

.icon-resize-2x {
    background-position-x: -290px;
}

.icon-volume-down {
    background-position-x: -145px;
}

.icon-home {
    background-position-x: -17px;
}

.icon-menu {
    background-position-x: -34px;
}

.icon-rotation {
    background-position-x: -58px;
}

.icon-info {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-position: -160px -68.5px;
    background-size: 319px 91px;
    margin-top: 6.5px;
}

.icon-customer-service {
    background: url("/media/static/images/play-icons.png?_=20191204") no-repeat;
    display: inline-block;
    width: 16px;
    height: 16px;
    background-position: -224px -68.5px;
    background-size: 319px 91px;
    margin-top: 8px;
}

.icon-share,
.icon-add2screen {
    width: 24px;
    height: 24px;
    background-size: 319px 91px;
    background-position: -200px -64.5px;
    margin-top: 0;
}

.icon-add2screen {
    background-position: -176px -64.5px;
}

#webplay-container {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 20000;
    border: none;
    bottom: 0;
    left: 0;
}

#control-wrapper ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#control-style-popup {
    width: 280px;
    height: 322px;
    border-radius: 8px;
    position: absolute;
    z-index: 10011;
    font-size: 13px;
    overflow: hidden;
    transform: scale(0);
    transition: transform .5s;
    touch-action: manipulation;
}

#control-style-popup.animate {
    transform: scale(1);
}

#control-style-popup .title {
    text-align: center;
    font-size: 13px;
    justify-content: center;
}

#control-style-popup .panel {
    background: rgba(36, 37, 42, .9);
    padding: 5px 15px;
    color: #fff;
    margin-bottom: 7px;
}

#control-style-popup .video-quality {
    overflow: hidden;
    height: auto;
}

#control-style-popup .video-quality li {
    width: 25%;
    float: left;
    list-style: none;
    text-align: center;
}

#control-style-popup .btn {
    padding: 0 7px;
    font-size: 12px;
}

#control-style-popup .btn.active,
#control-style-popup .active .btn {
    border: 1px #237aff solid;
    border-radius: 10px;
    color: #237aff;
}

#control-style-popup .btn:hover {
    color: #237aff;
}

#control-style-popup .top {
    overflow: hidden;
    height: auto;
}

#control-style-popup .icon {
    background-image: url(/media/static/images/play-icons2.png?_=20200106);
    background-repeat: no-repeat;
    background-size: 78px 76px;
    display: inline-block;
    width: 25px;
    height: 25px;
}

#control-style-popup p,
#control-style-popup .center {
    display: flex;
    align-items: center;

    /* justify-content: center; */
}

#control-style-popup .icon-delay.warning {
    background-position-x: -25px;
}

#control-style-popup .icon-delay.danger {
    background-position-x: -50px;
}

#control-style-popup .icon-clipboard {
    background-position: 0 -25px;
}

#control-style-popup .icon-quit {
    background-position: -25px -25px;
}

#control-style-popup .mode {
    width: 50%;
    padding: 20px 15px;
}

#control-style-popup .mode .delay {
    justify-content: center;
}

#control-style-popup .mode .delay-value {
    display: inline-block;
    width: 47px;
}

#control-style-popup .action-btns {
    display: flex;
    align-content: center;
    justify-content: center;
}

#control-style-popup .action-btns .icon {
    widows: 26px;
    height: 26px;
    background-position-y: -50px;
}

#control-style-popup .action-btns > a {
    display: inline-block;
    width: 48px;
    height: 48px;
    background: #5b5c61;
    border-radius: 50%;
    text-align: center;
    margin: 0 15px;
}

#control-style-popup .icon-back {
    background-position-x: 0;
}

#control-style-popup .icon-home {
    background-position-x: -26px;
}

#control-style-popup .icon-menu {
    background-position-x: -52px;
}

#right-btns .bottom {
    position: absolute;
    bottom: 30px;
    width: 35px;
}

#control-wrapper.resize-1x #right-btns .bottom {
    bottom: 0;
}

#right-btns .video-quality {
    margin: 0;
    padding: 0 3px;
}

#right-btns .video-quality li {
    border: 1px #ccc solid;
    text-align: center;
    margin: 15px 0;
    padding: 2px 0;
    border-radius: 3px;
}

#right-btns .video-quality li.active {
    background: #fff;
    color: #353535;
}

#right-btns .func-action {
    margin-bottom: 10px;
    text-align: center;
    width: 29px;
    margin-left: 3px;
}

#right-btns .func-action li {
    margin: 12px 0;
    cursor: pointer;
}

#right-btns .func-action li p {
    margin: 3px 0;
    font-size: 12px;
    text-overflow: ellipsis;
    overflow: hidden;
}

#right-btns .func-action .action-icon {
    width: 29px;
    height: 29px;
    background-position-y: -34px;
    background-size: 319px 91px;
}

.icon-flip {
    background-position: -206px 0 !important;
}

.icon-switch {
    background-position: -235px 0 !important;
}

/* #right-btns .icon-quit { */

/* margin-top: 20px; */

/* } */

#play-loading {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    bottom: 0;
    z-index: 20002;
    background: #fff;
    display: none;
}

#play-loading.dark {
    background: #434343;
}

#play-loading img {
    width: 80px;
    margin: 0 auto;
    margin-top: 200px;
    display: block;
}

#play-loading .btn {
    padding: 2px 10px;
}

#quick-phone-list {
    left: 250px;
    top: 200px;
}

#quick-phone-list .content {
    max-height: 400px;
    padding: 0 15px;
    overflow-y: scroll;
}

/* #quick-phone-list .content::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}

#quick-phone-list .content::-webkit-scrollbar-thumb {
    background-color: #D8D8D8;
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
} */

#quick-phone-list .search input {
    /* height: 25px; */
    padding: 5px 0;
    background: rgba(255, 255, 255, 1);
    border-radius: 2px;
    border: 1px solid rgba(223, 224, 224, 1);
    margin: 15px 0;
    width: 100%;
    padding-left: 10px;
    outline: none;
}

#quick-phone-list .header {
    border-bottom: none;
}

#quick-phone-list .header .close {
    border-left: none;
}

#quick-phone-list .phone-list {
    margin: 0;
}

#quick-phone-list .phone-list > div {
    border: 1px solid rgba(223, 224, 224, 1);
    border-radius: 4px;
    height: 33px;
    line-height: 33px;
    margin-bottom: 7px;
    cursor: pointer;
    background-color: #fff;
    position: relative;

    /* overflow: hidden; */
    text-overflow: ellipsis;
    white-space: nowrap;
}

#quick-phone-list .phone-list > div.active {
    border-color: #247aff;
    border-left-width: 8px;
    padding-left: 8px;
}

#quick-phone-list .grant-status {
    color: #fff;

    /* height: 15px;
    line-height: 15px;
    right: 0px;
    top: 0px; */
    height: 33px;
    line-height: 33px;
    right: -1px;
    top: -1px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    padding: 0 6px;
    font-size: 12px;
    position: absolute;
}

#quick-phone-list .grant-status-1 {
    background-color: #ffaf00;
}

#quick-phone-list .grant-status-2 {
    background-color: #237aff;
}

.icon-quit {
    background-position-x: -29px;
}

.icon-clipboard {
    background-position-x: -87px;
}

.icon-easy-switch {
    background-position-x: -50px;
    background-position-y: -25px;
}

#control-wrapper {
    display: none;
    width: 100%;
    z-index: 10006;
    height: 100%;
    position: fixed;
    background: none;

    /* overflow: hidden; */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#suspended-ball {
    width: 56px;
    height: 56px;
    background: url(/media/static/images/play-icons.png?_=20190826) no-repeat;
    border-radius: 50%;
    position: fixed;
    font-size: 20px;
    text-align: center;
    background-position-y: -126px;
    z-index: 10009;
    cursor: pointer;
    top: 30px;
    left: 30px;
    touch-action: manipulation;
}

#suspended-ball.warning {
    background-position-x: -56px;
}

#suspended-ball.danger {
    background-position-x: -112px;
}

#right-btns.horizontal .video-quality {
    float: left;
    width: 180px;
    margin: 8px 5px;
}

#right-btns.horizontal .video-quality li {
    display: inline-block;
    margin: 0 6px;
    padding: 0 3px;
}

.mypopup {
    position: fixed;
    width: 320px;
    top: 100px;
    z-index: 100002;
    background: rgba(255, 255, 255, .9645);
    border-radius: 10px;
    padding: 15px 20px;
    display: none;
    border: 1px solid #eee;
}

.mypopup .header {
    border-bottom: 1px solid #d8d8d8;
    position: relative;
    padding-bottom: 15px;
}

.mypopup .header .title {
    color: #4d4d4d;
}

.mypopup .header .btns {
    position: absolute;
    right: 0;
    top: 0;
}

#control-clipboard .header .clear {
    color: #247aff;
    background: none;
    border: none;
    font-size: 13px;
    outline: none;
    padding: 0 10px;
    margin: 0 30px;
}

.mypopup .header .close {
    border-left: 1px solid #ddd;
    padding-left: 5px;
    outline: none;
    color: #b3b3b3;
    opacity: 1;
}

.mypopup .header .close::before {
    content: " ";
    display: inline-block;
    width: 17px;
    height: 17px;
    background: url(/media/static/images/play-icons.png?_=20190826) no-repeat;
    background-size: 319px 91px;
    background-position-x: -87px;
    background-position-y: -68px;
    margin-top: 3px;
}

#control-clipboard .del {
    background: #247aff;
    color: #fff;
    font-size: 12px;
    text-align: center;
    border-radius: 3px;
    position: absolute;
    right: 10px;
    top: 12px;
    display: none;
    padding: 1px 5px;
}

#control-clipboard .btn-copy {
    background: rgba(36, 122, 255, 1);
    border-radius: 4px;
    color: #fff;
}

#control-clipboard .history {
    height: 260px;
    overflow-x: hidden;
    overflow-y: auto;
    list-style: none;
    padding: 0 5px;
}

#new-clipboard {
    width: 90%;
    padding: 5px 10px;
    border-radius: 15px;
    border: 1px #ddd solid;
    outline: none;
}

#new-clipboard::placeholder {
    color: #d1d1d1;
}

.show-scrollbar::-webkit-scrollbar {
    -webkit-appearance: none;
}

.show-scrollbar::-webkit-scrollbar:vertical {
    width: 11px;
}

.show-scrollbar::-webkit-scrollbar:horizontal {
    height: 10px;
}

.show-scrollbar::-webkit-scrollbar-thumb {
    border-radius: 8px;
    border: 2px solid white;
    background-color: #d8d8d8;
}

#control-clipboard .history li {
    padding: 10px 5px;
    border-bottom: 1px solid #d8d8d8;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: pointer;
    color: #727272;
    position: relative;
}

#control-clipboard .history li::before {
    content: " ";
    display: block;
    width: 17px;
    height: 17px;
    float: left;
    margin-top: 1px;
    margin-right: 5px;
    background: url(/media/static/images/play-icons.png?_=20190826) no-repeat;
    background-size: 319px 91px;
    background-position-x: -136px;
    background-position-y: -68px;
}

.days-list {
    list-style: none;
}

#offer-banner {
    position: relative;
    margin-bottom: 10px;
}

#offer-banner .close {
    position: absolute;
    right: 10px;
    top: 5px;
}

.days-list li {
    display: inline-block;
    color: #bbb;
    border: 1px #bbb solid;
    margin: 0 15px 0 0;
    font-size: 12px;
    width: 24px;
    text-align: center;
    height: 24px;
    line-height: 24px;
    border-radius: 50%;
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}

.days-list li.active {
    background-color: #237aff;
    border-color: #237aff;
    color: #fff;
}

#control-clipboard .history li.active::before {
    background-position-x: -112px;
}

#control-clipboard li.new::before {
    margin-top: 8px;
}

#control-clipboard li.active .del {
    display: inline-block;
}

#control-clipboard .footer {
    text-align: center;
    padding: 15px 0 0;
}

#top-info {
    position: fixed;
    width: 352px;
    background: rgba(52, 52, 52, .96);
    color: #fff;
    height: 28px;
    line-height: 28px;
    font-size: 13px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    display: none;
}

#top-info > div {
    display: inline-block;
    padding: 0 10px;
}

#top-info .info {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

#top-info .vmcode {
    font-size: 12px;
    padding: 0 3px;
}

.mydialog {
    width: 320px;
    position: fixed;
    box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12);
    z-index: 99999;
    background: #fff;
    border-radius: 5px;
    padding: 10px 15px;
    top: 0;
}

.mydialog .content {
    font-size: 16px;
    color: #666;
    min-height: 30px;
    line-height: 25px;
    padding: 8px 0;
    max-height: 350px;
    overflow-y: scroll;
    word-break: break-word;
}

/* .mydialog .content::-webkit-scrollbar {
    -webkit-appearance: none;
    appearance: none;
    width: 5px;
}

.mydialog .content::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .5);
    box-shadow: 0 0 1px rgba(255, 255, 255, .5);
} */

.mydialog .footer {
    text-align: right;
    padding: 7px 0;
}

.mydialog .footer a {
    color: #247aff;
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    cursor: pointer;
    padding-left: 30px;
}

.mydialog .footer a:hover {
    text-decoration: none;
}

.mydialog .footer a.text-danger {
    color: #a94442;
}

.mydialog .title {
    font-weight: bold;
    font-size: 18px;
    padding: 10px 0;
}

.radio.disabled {
    color: #ccc;
}

#redfinger-phone.ipad {
    max-width: 100% !important;
    max-height: 100% !important;
}

.website-links {
    padding-bottom: 20px;
}

#goods-options .radio-tips {
    padding-left: 18px;
    font-size: 13px;
    color: #237aff;
}

#dashboard-activation-code .goods-option h4 {
    font-size: 14px;
    font-weight: bold;
}

#goods-options .goods-option {
    margin-bottom: 20px;
}

#goods-options .goods-option .radio {
    margin-top: 12px;
    margin-bottom: 12px;
}

.website-links a {
    margin-right: 10px;
}

.posts-thumb-list {
    margin-bottom: 25px;
}

.posts-thumb-list li {
    list-style: none;
    margin-top: 25px;
    box-shadow: 1px 2px 5px #dedede;
    padding: 20px;
    border-radius: 5px;
    overflow: hidden;
}

.posts-thumb-list article {
    display: flex;
}

.posts-thumb-list article .cover img {
    border-radius: 3px;
}

.posts-thumb-list article .info {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.posts-thumb-list li h2 {
    font-size: 20px;
    margin: 0 0 10px;
}

/* .posts-thumb-list li h2 a {
    color: #247aff;
} */

.posts-thumb-list .short-desc {
    color: #666;
}

.posts-thumb-list footer {
    color: #ccc;
}

@media (max-width: 360px) {
    #navbar-brand {
        width: 180px;
    }
}

@media (min-width: 768px) {
    #dashboard-phone .phone-item .maintain-tips {
        margin: -10px -20px 5px;
    }

    .reward-dialog {
        width: 400px;
    }

    #quick-phone-list {
        width: 600px;
    }

    #quick-phone-list .search {
        padding: 0 5%;
    }

    #quick-phone-list .phone-list > div {
        width: 40%;
        margin: 0 5% 12px;
    }

    #navbar-brand {
        margin-left: 0;
    }

    #redfinger-phone {
        max-height: 85% !important;
    }

    #redfinger-phone.ipad,
    #redfinger-phone.iphone {
        max-width: 100% !important;
        max-height: 100% !important;
    }

    #suspended-ball {
        display: none;
    }

    #play-loading {
        width: 405px;
        height: 665px;
        border-radius: 3px;

        /* position: relative; */

        /* margin: 0px auto; */
    }

    #category-posts {
        min-height: 300px;
    }
}

#control-wrapper.resize-1x #redfinger-phone {
    max-width: 720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#control-wrapper.resize-1x.horizontal .video-quality {
    display: none;
}

#mask,
#redfinger-mask {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    background: rgba(0, 0, 0, .65);
    z-index: 10005;
}

.dashboard-icon {
    display: inline-block;
    height: 20px;
    user-select: none;
    -webkit-user-select: none;
}

.dashboard-icon::before {
    background: url("/media/static/images/dashboard-icon.png?_=20190806") no-repeat;
    background-size: 128px 84px;
    background-position-y: -64px;
    display: block;
    width: 20px;
    height: 20px;
    cursor: pointer;
    float: left;
    content: " ";
    margin-right: 5px;
}

.dashboard-icon.icon-reboot::before {
    background-position-x: 0;
}

.dashboard-icon.icon-recharge::before {
    background-position-x: -20px;
}

.dashboard-icon.icon-more::before {
    background-position-x: -40px;
}

.dashboard-icon.icon-webplay::before {
    width: 100%;
    height: 100%;
    background-position: 0 0;
    background-size: 64px 42px;
}

.dashboard-icon.icon-webplay.disable::before {
    background-position: -32px 0;
}

.dashboard-icon.icon-chevron-right {
    width: 7px;
    height: 13px;
}

.dashboard-icon.icon-chevron-right::before {
    width: 7px;
    height: 13px;
    background-position-x: -60px;
}

#dashboard-phone .phone-item .phone .btn-error {
    padding: 0 8px;
    font-size: 12px;
    border-radius: 4px;
    background: #d9534f;
    color: #fff;
}

#dashboard-phone .phone-item .maintain-tips {
    color: #a94442;
    background-color: #f2dede;
    padding: 5px 10px;
    margin: -10px -10px 5px;
    margin-top: -13px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
}

#preview-mode .maintain-tips {
    z-index: 10006;
}

.dashboard-icon.icon-webplay {
    width: 32px;
    height: 32px;

    /* float: right; */
    margin-top: 10px;
}

#authorization .icon-chevron-right {
    position: absolute;
    right: 15px;
    top: 51px;
}

@media (min-width: 1200px) {
    /* .container {
        width: 1030px;
    } */

    #navbar .container {
        width: 1170px;
    }

    .mydialog {
        width: 640px;
    }

    #product-cover .newcontent {
        width: 1170px;
    }
}

@media (max-width: 1000px) {
    #control-wrapper {
        background: #343434;
    }
}

.breadcrumb {
    background: none;
    margin-top: 20px;
    padding: 8px 0;
}

.btn-black {
    background: #000;
}

.btn-blue {
    background: #247aff;
    color: #fff;
    border-color: #247aff;
}

.btn-muted {
    background-color: #ccc;
    border-color: #ccc;
    color: #fff;
}

.text-blue {
    color: #247aff;
}

.btn-text-blue {
    color: #247aff;
    border: none;
    background: none;
    font-weight: bold;
}

.text-muted {
    color: #777;
}

.text-muted2 {
    color: #ccc;
}

.btn-blue:hover,
.btn-blue:focus {
    color: #fff;
    background: rgba(36, 122, 255, .85);
    border-color: #247aff;
}

.margin-t-40 {
    margin-top: 40px;
}

#navbar {
    position: fixed;
    width: 100%;
    background-color: #fff;
    z-index: 10001;
    padding: 14px 0;

    /* border-bottom: 1px #ccc solid;
    border-top: 5px #247aff solid; */
    border-radius: 0;
    margin-bottom: 0;
    border-right: none;
    border-left: none;
    top: 0;
    transition: top .35s;
}

#navbar.animate {
    top: -73px;
}

.navbar-hyperspace a {
    color: #484848;
    font-weight: bold;
}

.navbar-toggle {
    background-color: #247aff;
}

.navbar-toggle .icon-bar {
    background-color: #fff;
}

.navbar-hyperspace .download a {
    background-color: #247aff;
    color: #fff;
    border-radius: 6px;
}

.navbar-hyperspace .download a:hover {
    background-color: rgba(36, 122, 255, .8);
    color: #fff;
}

.navbar-nav > li > a {
    padding-top: 8px;
    padding-bottom: 8px;
}

.navbar-nav .dropdown .lang-icon {
    display: inline-block;
    width: 22px;
    height: 22px;
    background: url(/media/static/images/2x/home/lang-icon.png) no-repeat;
    background-size: cover;
    vertical-align: middle;
}

.navbar-nav {
    margin: 7.5px 0;
}

.navbar-nav > li {
    margin-left: 6px;
}

.navbar-brand {
    padding: 0;
    height: auto;
}

.navbar-brand img {
    height: 46px;
}

#navbar-brand {
    margin-top: 2.5px;
}

.navbar-brand.pockm img {
    width: 128px;
    height: auto;
}

.navbar-brand.pockm {
    padding: 0 15px;
}

.navbar .dropdown-menu li a {
    padding: 12px 15px;
}

.btn-hyper,
.btn-hyper:focus {
    color: #fff;
    width: auto;
    height: 45px;
    border: 2px #fff solid;
    padding: 11px 12px;
}

#product-cover .btn:hover {
    color: #fff;
}

#product-cover .description {
    margin-top: 20px;
    width: 530px;
    font-size: 20px;
    color: rgba(67, 76, 111, .3);
    line-height: 28px;
}

.btn-hyper .glyphicon {
    font-size: 16px;
    top: 4px;
    margin-left: 8px;
}

.btn-hyper-gp {
    background-color: #000;
    padding: 5px 12px !important;
    position: relative;
    z-index: 100;
}

.btn-web-play {
    background-color: #fff;
    color: #247aff;
    height: 45px;
    padding: 11px 12px;
}

.btn-web-play:hover,
.btn-web-play:focus {
    color: rgba(36, 122, 255, .85) !important;
}

.ricon {
    display: inline-block;
    width: 16px;
    height: 16px;
    background: url(/media/static/images/icon@2x.png) no-repeat;
    background-size: 48px 16px;
    background-position-y: 0;
    background-position-x: 0;
}

.ricon-ios {
    background-position-x: -16px;
}

.ricon-windows {
    background-position-x: -32px;
}

.btn-go-setup {
    line-height: 41px;
    height: 45px;
    padding: 0;
}

.btn-go-setup:focus {
    padding: 0;
}

.btn-go-setup .icons {
    display: inline-block;
    margin: 0;
    padding: 0;
    height: 16px;
}

.btn-go-setup .ricon {
    margin: 2px 5px 0;
    float: left;
}

/* 鏂版牱寮弒tart */
.new-btn {
    display: flex;
    align-items: center;
    justify-content: center;
}

.new-btn.focus,
.new-btn:focus,
.new-btn:hover {
    color: #237aff;
    text-decoration: none;
}

.browser {
    width: 600px;
    height: 50px;
    background: linear-gradient(270deg, #416dff 0%, #209eff 100%);
    border-radius: 8px;
    font-size: 20px;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: 600;
    color: #fff;
    margin-bottom: 20px;
    overflow: hidden;
    position: relative;
}

.browser:hover {
    color: #fff;
}

.browser .hot-icon {
    position: absolute;
    right: 0;
    top: 0;
    width: 54px;
    height: 39px;
    background: url("/media/static/images/2x/home/hot.png") no-repeat;
    background-size: cover;
}

.btn-box {
    display: flex;
    justify-content: space-between;
    width: 600px;
    font-weight: 600;
}

.btn-new-gp {
    width: 190px;
    height: 45px;
    font-size: 12px;
    background: rgba(0, 0, 0, 0);
    font-family: PingFangSC-Semibold, PingFang SC;
    color: #237aff;
    border-radius: 8px;

    /* border: 2px solid #fff; */
    border: 1px solid #237aff;
}

#android-dl-btn {
    width: 200px;
}

#win-dl-btn {
    width: 202px;
}

.btn-new-gp .icon {
    width: 15px;
    height: 15px;
    margin-right: 3px;
}

.btn-new-gp .aid {
    background: url(/media/static/images/2x/home/anroid-icon-1.png?_=20230602) no-repeat;
    background-size: cover;
}

.btn-new-gp .win {
    margin-right: 6px;
    background: url(/media/static/images/2x/home/win-icon-1.png?_=20230620) no-repeat;
    background-size: cover;
}

.btn-play {
    /* border: 0; */
    background: #000;
    border-radius: 8px;
    overflow: hidden;
}

.btn-play .g-play {
    width: 190px;
    height: 45px;

    /* background: url(/media/static/images/2x/home/g-paly@2x.png) no-repeat;
    background-size: cover; */
}

.link-box {
    margin-top: 28px;
    width: 600px;
    text-align: center;
}

.link-box .arrow {
    display: inline-block;
    margin-left: 10px;
    width: 6px;
    height: 10px;
    background: url(/media/static/images/2x/home/arrow-icon.png) no-repeat;
    background-size: cover;
}

.link-box .go-choose {
    color: #434c6fff;
    text-decoration: underline;
}

.glide-icon {
    display: none;
    width: 14px;
    margin: auto;
    margin-top: 36px;
}

#product-cover .download .btn {
    width: 204px;
    margin-right: 24px;
}

#product-cover .newcontent {
    /* margin-top: 140px; */
    position: relative;
    z-index: 2;
    margin-top: 7%;
}

#product-cover .word-title {
    max-width: 800px;
}

#product-cover .shape {
    width: 45px;
    height: 6px;
    background: #434c6f;
    margin-bottom: 26px;
    display: none;
}

#product-cover {
    /* color: #fff; */
    color: #434c6fff;
    padding: 160px 0 130px;

    /* background: url(/media/static/images/2x/banner-bg.png) no-repeat bottom; */
    background: url(/media/static/images/2x/home/banner-bg-1.png) no-repeat bottom;
    background-size: contain;

    /* background-color: #237aff; */
    background-color: #ecf5ff;
    position: relative;
    min-height: 800px;
}

.cover-img {
    position: absolute;
    bottom: 30px;

    /* max-width: 700px; */
    width: 720px;
    right: -16%;
    top: -11%;
    z-index: -1;
}

#product-cover h1 {
    font-weight: bold;
    font-size: 50px;

    /* font-weight: normal; */
    color: #434c6f;
    line-height: 62px;
    margin: 0 0 22px;
}

#product-cover h2 {
    font-size: 28px;
    color: #434c6f;
    line-height: 34px;
    margin: 22px 0;
}

#product-cover .download {
    margin: 30px 0;
    z-index: 100;
    position: relative;
}

#content {
    padding-top: 73px;
}

#future {
    background-color: #f5f9ff;
    padding: 50px 0;
}

.future-img img {
    display: block;
    margin: 0 auto;
}

#future-list .item {
    overflow: hidden;
    height: auto;

    /* width: 100%; */
}

#six-reasons .item {
    margin-bottom: 50px;
}

#future-list .pic img {
    display: block;
    margin: 0 auto;
}

#future-list .intro {
    float: left;
}

#future-list .item h3 {
    font-size: 24px;
    margin-top: 0;
}

#future-list .header {
    padding: 30px 0;
}

#future-list .header h2 {
    font-size: 28px;
    font-weight: bold;
}

.hyperspace-apps {
    background-color: #f6f9fe;
    padding: 30px;
}

.hyperspace-apps .item {
    clear: both;
    display: block;
    padding: 10px 0;
    color: #333;
}

.hyperspace-apps .item:hover {
    color: rgba(51, 51, 51, .8);
}

.hyperspace-apps .item img,
.hyperspace-apps .item .icon {
    width: 40px;
    height: 40px;
    float: left;
}

.hyperspace-apps .item .icon {
    font-size: 40px;
    margin-top: -6px;
    color: #bababa;
}

.hyperspace-apps .item p {
    float: left;
    line-height: 40px;
    padding-left: 15px;
}

.hyperspace-apps .title {
    font-size: 24px;
    margin-bottom: 10px;
}

.platform-browser .item {
    padding: 0;
}

.platform-browser .item p {
    padding: 3px 0;
    line-height: 20px;
    margin-bottom: 5px;
}

.bg1 {
    background-color: #f8fafd;
}

#footer-download {
    background-color: #fff;
    padding: 60px 80px 80px;

    /* margin-top: 20px; */
}

#footer-download .intro {
    margin-bottom: 20px;
    font-size: 18px;
}

#footer-download .btn-primary {
    background-color: #247aff;
    border-color: #247aff;
    padding: 10px 20px;

    /* border-radius: 20px; */
}

#footer-download .btn-primary:hover {
    box-shadow: 2px 2px 2px rgba(36, 122, 255, .6);
}

#footer {
    background-color: rgba(30, 39, 54, .88);
    color: #fff;
    padding: 40px 0;
}

#footer a {
    color: rgba(255, 255, 255, .8);
}

#copyright {
    border-top: 1px solid rgba(255, 255, 255, .1);
    padding-top: 10px;
}

#copyright .intro {
    font-size: 12px;
    color: #ccc;
}

#footer .links ul {
    list-style: none;
    padding: 0;
    margin-bottom: 48px;
}

#footer .links li {
    margin: 5px 0;
    font-size: 12px;
}

#footer h6 {
    font-size: 16px;

    /* color: #5bc0de; */
}

#footer .social {
    text-align: right;
    padding: 0;
}

#footer .social a {
    margin-left: 10px;
}

#footer .social a:hover {
    text-decoration: none;
}

/* posts-content */

.posts-content {
    padding-bottom: 70px;
    color: #57646c;
    font-size: 16px;
}

.posts-content h1 {
    font-size: 28px;
    font-weight: 700;
    text-align: center;
    line-height: 35px;
}

.page-content h1 {
    margin: 60px 0;
}

.posts-content p {
    margin-bottom: 25px;
    font-size: 16px;
    line-height: 1.7em;
}

.posts-content h2 {
    font-size: 23px;
    font-weight: 700;
    margin-bottom: 20px;
    line-height: 30px;
}

.posts-content h3 {
    font-weight: 700;
    font-size: 19px;
}

.posts-content blockquote {
    margin-top: 30px;
}

.posts-content blockquote p:first-child {
    margin-top: 0;
}

.posts-meta {
    color: #8f8f8f;
    font-size: 14px;
    margin: 20px 0;
    text-align: center;
}

.inposts-link,
.callout {
    background: #fbfbfb;
    border-left: 6px solid #ddd;
    padding: 30px 30px 30px 40px;
    margin: 40px 0;
    -moz-box-shadow: 0 2px 5px 1px rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 2px 5px 1px rgba(0, 0, 0, .1);
    box-shadow: 0 2px 5px 1px rgba(0, 0, 0, .1);
}

ol.myorder {
    list-style-type: none;
    counter-reset: li-counter;
}

ol.myorder li {
    position: relative;
}

ol.myorder li::before {
    position: absolute;
    top: 1px;
    left: -24px;
    width: 24px;
    height: 24px;
    font-size: 15px;
    line-height: 26px;
    text-align: center;
    color: #fff;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    background-color: #999;
    content: counter(li-counter);
    counter-increment: li-counter;
}

.posts-content ul,
.posts-content ol {
    margin-left: 25px;
    margin-top: 25px;
}

.posts-content ul p {
    margin-top: 10px;
}

.posts-content ul li {
    /* margin-bottom: 22px; */
    padding-left: 10px;
    position: relative;
    margin-bottom: 10px;
    line-height: 1.5;
}

.posts-content ol li {
    position: relative;
    margin-bottom: 10px;
    padding-left: 5px;
    line-height: 24px;
}

.posts-content img {
    max-width: 100%;
    display: block;
    margin: 10px auto;
}

.posts-content img.inline {
    display: inline-block;
}

.category-head {
    background: #1e2b44;
    color: #fff;
    padding: 20px 0 30px;
}

.related-posts {
    padding-left: 30px;
    margin-top: 25px;
    border-left: 1px solid #eee;
}

.posts-userbook {
    padding-left: 0;
    border-left: 0;
    border-right: 1px solid #eee;
}

.posts-userbook-content {
    padding-left: 50px;
}

.related-posts h3 {
    margin-top: 5px;
    font-size: 18px;
}

.related-posts ul {
    list-style: none;
    margin-top: 28px;
}

.related-posts li {
    margin-bottom: 10px;
}

.posts-content .btn-hyper-gp {
    margin: 0 auto;
    width: 166px;
    display: block;
}

.posts-content .btn-hyper-gp img {
    margin: 0;
}

.posts-content .btn-blue {
    padding: 11px 0;
    height: 45px;
    width: 166px;
    display: block;
    margin: 0 auto;
}

.nav > li > a:focus,
.nav > li > a:hover {
    background-color: #fff;
    color: #247aff;
}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
    background-color: #fff;
}

.navbar-nav > li > .dropdown-menu {
    margin-top: 15px;
    box-shadow: 0 3px 9px rgba(0, 0, 0, .175);
    border-color: #e7e7e7;
}

#nav-lang {
    float: right;
}

.toggle-lang,
#refresh-btn,
#customer-service-btn {
    background: none;
    border: 1px #247aff solid;
    height: 34px;
    line-height: 34px;
    padding: 0 10px;
    color: #247aff;
}

.posts-list {
    margin: 30px 0;
}

.posts-list li {
    margin-bottom: 10px;
}

.my-panel {
    background-color: #f6f9fe;
    padding: 15px;
    margin-bottom: 10px;
    border-radius: 5px;
}

.panel-dashboard {
    border: none;
}

.panel-dashboard .panel-heading {
    background-color: #237aff;
    color: #fff;
    text-align: center;
}

#dashboard-left .user-panel .panel-body {
    background: none;
    display: flex;
    align-items: center;
    height: 140px;
    width: 100%;
    position: relative;
}

#dashboard-left .user-panel .info {
    margin-left: 15px;
}

.panel-dashboard .default-avatar {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    text-align: center;
    line-height: 55px;
    background-color: #fff;
    font-size: 25px;
    color: #ccc;
}

.panel-dashboard .login-type {
    position: absolute;
    right: 20px;
    top: 30px;
}

.panel-dashboard .login-type img {
    width: 20px;
}

.user-panel .email {
    width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 5px;
}

#dashboard-home {
    text-align: center;
}

#dashboard-home .item {
    background-color: #f6f9fe;
    padding: 35px 0;
    margin-bottom: 20px;
    border-radius: 3px;
    cursor: pointer;
}

#dashboard-home .ico {
    width: 80px;
    margin: 0 auto;
    display: block;
    font-size: 80px;
    color: #cdcdcd;
}

#dashboard-home .title {
    margin-top: 10px;
    font-weight: bold;
}

#dashboard-phone .phone-item {
    background-color: #f6f9fe;
    padding: 13px 20px 0;
    margin: 13px 0;
    position: relative;
    border-radius: 3px;

    /* overflow: hidden; */
}

#dashboard-phone .list-style-preview {
    position: relative;
    height: auto;
    overflow: hidden;
    display: flex;
    align-items: center;
    padding: 10px 0;
}

#preview-mode {
    margin: 35px auto 30px;
    cursor: pointer;
    position: relative;
    width: 300px;
    min-height: 533px;
    z-index: 1;
}

.icon-vip {
    /* width: 25px; */
    height: 32px;
    background: url(/media/static/images/2x/vip@2x.png) no-repeat center;
    background-size: 25px 32px;
}

#preview-mode .topbar .icon-pad {
    margin-left: 10px;
}

.btn-recharge {
    height: 24px;
    text-align: center;
    color: #fff;
    background-color: #247aff;
    border-radius: 15px;
    font-size: 12px;
    display: inline-block;
    padding: 0 10px;
    line-height: 24px;
    box-shadow: 0 1px 5px 0 rgba(46, 155, 255, .84);
    min-width: 50px;
}

.btn-recharge:hover {
    color: #fff;
    text-decoration: none;
    box-shadow: none;
}

#preview-mode .preview-img {
    transform: rotate(90deg);

    /* width: 450px; */
    position: relative;
    z-index: 9999;
}

#preview-mode .intro {
    position: absolute;
    top: 0;
    z-index: 10007;
    background: rgba(0, 0, 0, .5);
    width: 100%;
    color: #fff;
    margin: 0;
    padding: 8px 0;
}

#preview-mode .intro .items {
    padding-left: 10px;
}

#preview-mode .intro p {
    margin: 0;
    font-size: 12px;
}

#preview-mode .topbar {
    position: absolute;
    top: -40px;
    width: 100%;
    height: 30px;
    z-index: 10000;
    text-align: right;
    padding: 3px 0;
    user-select: none;
    -webkit-user-select: none;
    cursor: pointer;
}

#preview-mode .topbar-content {
    background: #fff;
    position: absolute;
    top: 0;
    min-width: 310px;
    min-height: 100px;
    z-index: 10008;
    box-shadow: 0 0 6px rgba(0, 0, 0, .6);
    border-radius: 5px;
    overflow: hidden;
    padding: 13px;
    left: -7px;
}

#preview-mode .prev,
#preview-mode .next {
    position: absolute;
    display: inline-block;
    background: #aaa;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    border-radius: 50%;
    top: 210px;
    color: #fff;
    user-select: none;
    -webkit-user-select: none;
}

#preview-mode .prev {
    left: -40px;
}

#preview-mode .next {
    right: -40px;
}

#preview-mode .indicator {
    position: absolute;
    bottom: -25px;
    width: 100%;
    text-align: center;
    color: #ccc;
}

#preview-mode .loadding {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    top: 0;
    left: 0;
    right: 0;
    z-index: 10005;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    box-shadow: 0 0 11px rgba(0, 0, 0, .25);
    border-radius: 5px;
    user-select: none;
    -webkit-user-select: none;
}

#preview-mode .loadding img {
    width: 91px;
}

#preview-mode .loadding p {
    color: #b4bac3;
    margin-top: 10px;
    font-size: 13px;
}

#preview-mode .topbar-content .header {
    height: auto;
    overflow: hidden;
    color: #237aff;
    padding: 6px 0;
}

#preview-mode .topbar-content .header .padname {
    color: #434343;
}

#preview-mode .topbar-content .actions {
    text-align: center;
}

#preview-mode .topbar-content .actions > div {
    padding-top: 10px;
}

#preview-mode .topbar-content .actions p {
    font-size: 12px;
}

#preview-mode .topbar-content .actions .disabled {
    /* color: #BCC3D0; */
    opacity: .3;
}

#preview-mode .topbar-content .footer {
    padding-top: 8px;
}

#preview-mode .topbar-content .padcode {
    background-color: #f3f8ff;
    color: #434343;
    padding: 7px 10px;
    font-size: 13px;
    border-radius: 5px;
    margin: 0;
}

.icon-pad {
    display: inline-block;
    width: 26px;
    height: 26px;
    background-image: url(/media/static/images/pad-icon.png);
    background-repeat: no-repeat;
    background-size: 155.5px 58px;
    background-position-y: 0;
}

.icon-pad.reboot {
    background-position-x: 0;
}

.icon-pad.reset {
    background-position-x: -26px;
}

.icon-pad.rename {
    background-position-x: -52px;
}

.icon-pad.upload {
    background-position-x: -78px;
}

.icon-pad.authorize {
    background-position-x: -104px;
}

.icon-pad.sapphire {
    background-position-x: -130px;
}

.icon-pad.setting,
.icon-pad.refresh {
    background-position-y: -26px;
    width: 24px;
    height: 24px;
}

.icon-pad.refresh {
    background-position-x: -23.94px;
}

.icon-pad.blue-phone {
    width: 12px;
    height: 19px;
    background-position: -72.8px -26px;
    float: left;
}

.dashboard-header {
    overflow: hidden;
    height: auto;
    line-height: 30px;
}

.dashboard-header .title {
    font-size: 15px;
    font-weight: bold;
    height: 30px;
    line-height: 30px;
}

.dashboard-header .btn-list {
    display: flex;
    align-items: center;
    justify-content: center;
}

.blue-icon,
.blue-icon:focus,
.blue-icon:hover {
    color: #247aff;
    padding: 0;
    font-size: 22px;
    line-height: normal;
    border-radius: 0;
    border: none;
    display: inline-block;
    user-select: none;
    -webkit-user-select: none;
    outline: none;
}

#dashboard-phone .phone-item .icon {
    background: #eee;
    text-align: center;
    width: 80px;
    height: 80px;
    color: #005fff;
    border-radius: 50%;
    padding: 10px;
}

#dashboard-phone .phone-item > .phone {
    text-align: center;
}

/* #dashboard-phone .phone-item .glyphicon {
} */

#dashboard-phone .phone-item p {
    font-size: 12px;
    margin: 0;
}

#dashboard-phone .phone-item .action {
    border-top: 1px solid #e1e1e1;
    padding: 15px 0;
    clear: both;
}

#dashboard-phone .phone-item .action > div {
    width: 33.3333%;
    display: inline-block;
    cursor: pointer;
}

#dashboard-phone .phone-item .item-recharge {
    text-align: center;
}

#dashboard-phone .phone-item .item-more {
    text-align: right;
    position: relative;
}

#dashboard-phone .info {
    padding-left: 0;
}

#dashboard-phone .phone-item .topinfo {
    margin: 0 0 8px;
    display: flex;
    align-items: center;
}

#dashboard-phone .phone-item .phone {
    text-align: center;
}

#dashboard-phone .more-action {
    right: 0;
    left: auto;
}

#dashboard-phone .info p {
    margin: 9px 0;
    font-size: 14px;
    display: flex;
    align-items: center;
}

#dashboard-phone .info .label {
    margin-left: 5px;
    padding-bottom: .2em;
}

#dashboard-phone .dashboard-header .btn-list .icon {
    color: #247aff;
    font-size: 15px;
}

#dashboard-phone .top {
    height: 20px;
    width: 100%;
}

#dashboard-phone .top .name {
    color: #247aff;
    font-weight: bold;
    float: left;
}

#dashboard-phone .top .name .label-vip {
    background-color: #ff9d1a;
    margin-right: 3px;
    padding: 0 5px;
}

#dashboard-phone .top .name .label-gvip {
    background-color: #d754ee;
}

#dashboard-phone .top .name .label-trial {
    background-color: #777;
}

#coupon-items {
    color: #fff;
    padding-top: 20px;
}

#coupon-items .item {
    border-radius: 6px;
    padding: 15px 0;
    margin: 10px 0;
    cursor: pointer;
}

#coupon-items .item:hover {
    opacity: .85;
}

#coupon-items .coupon-type-0 {
    background-color: #ffaf00;
}

#coupon-items .coupon-type-1 {
    background-color: #6bafff;
}

#coupon-items .coupon-status-2 {
    background-color: #d8d8d8;
}

#coupon-items .item hr {
    border-top-style: dashed;
}

#coupon-items .item .divider {
    position: relative;
}

#coupon-items .item .divider::before,
#coupon-items .item .divider::after {
    content: " ";
    display: block;
    height: 20px;
    width: 10px;
    border-radius: 0 10px 10px 0;
    background-color: #fff;
    position: absolute;
    top: -10px;
}

#coupon-items .item .divider::after {
    border-radius: 10px 0 0 10px;
    right: 0;
}

#coupon-items .item .top {
    padding: 0 12px;
    height: auto;
    overflow: hidden;
}

#coupon-items .item .value-info {
    width: 30%;
    float: left;
}

#coupon-items .item .value-info > span {
    display: inline-block;
}

#coupon-items .item .value-info .value {
    font-size: 40px;
}

#coupon-items .item .value-info .suffix {
    font-size: 12px;
}

#coupon-items .item .top .code-info {
    width: 70%;
    float: left;
    font-size: 16px;
    font-weight: 600;
}

#coupon-items .item .code-info .time {
    font-size: 12px;
    font-weight: normal;
}

#coupon-items .item .code-info > div {
    margin: 2px 0;
}

#coupon-items .item .bottom {
    padding: 0 12px;
    height: 35px;
    overflow: hidden;
    font-size: 12px;
    display: flex;
    align-items: center;
}

#coupon-items .item .bottom p {
    font-size: 12px;
    margin: 0;
    line-height: 18px;
}

#coupon-items .item .go-use {
    background-color: #fff;
    display: block;
    padding: 1px 8px;
    font-size: 12px;
    border-radius: 3px;
    float: right;
}

#coupon-items .item .go-use:hover {
    text-decoration: none;
}

#coupon-items .coupon-type-0 .go-use {
    color: #ffaf00;
}

#coupon-items .coupon-type-1 .go-use {
    color: #6bafff;
}

#coupon-items .coupon-status-2 .go-use {
    color: #d8d8d8;
}

.coupon-select-item {
    margin: 0 10px;
    border-bottom: 1px #eee dashed;
    padding: 7px 0;
    cursor: pointer;
}

.coupon-select-item.enter {
    color: #237aff;
}

.coupon-select-item:last-child {
    border-bottom: none;
}

.coupon-select-item .code {
    margin: 0;
    font-weight: bold;
    color: #666;
    font-size: 14px;
}

.coupon-select-item .type {
    font-size: 12px;
    color: #3c763d;
    float: right;
}

.coupon-select-item .info {
    font-size: 12px;
    margin: 0;
    color: #aaa;
}

.block-box {
    background: rgba(248, 251, 255, 1);
    border-radius: 4px;
    padding: 10px 15px;
    margin-bottom: 12px;
}

.block-box > div {
    padding: 6px 0;
}

.block-box .title {
    color: #bcc3d0;
}

.block-box .value {
    color: #434343;
}

.grant-tips {
    color: #434343;
    margin-top: 21px;
    line-height: 1.6;
}

#dashboard-phone .remain {
    margin-bottom: 10px;
    text-align: right;
}

#dashboard-phone .remain .label {
    color: #666;
}

#dashboard-phone .remain .glyphicon {
    font-size: 14px;
}

.mytab {
    margin-top: 10px;
}

.mytab .item {
    display: inline-block;
    padding: 5px 10px;
    margin: 0 10px;
    cursor: pointer;
}

.mytab .item span.text {
    display: inline-block;
}

.mytab .item.active span::after {
    content: " ";
    display: block;
    height: 2px;
    background-color: #247aff;
}

.mytab.first-left :first-child {
    margin-left: 0;
    padding-left: 0;
}

#authorization .grant-list {
    margin-top: 15px;
}

#authorization .grant-item {
    cursor: pointer;
    position: relative;
}

/* #dashboard-phone .btn-list {
    text-align: right;
}

#dashboard-phone .btn-list .item {
    width: 20%;
    text-align: center;
    display: inline-block;
} */

#dashboard-order .header a {
    color: #484848;
    margin-right: 15px;
}

#dashboard-order .header a.router-link-exact-active {
    color: #237aff;
    font-weight: bold;
}

#dashboard-order .order-item {
    margin: 13px 0;
    box-shadow: 0 3px 10px 0 #f6f6f6;
    padding: 0;
    background: none;
}

#dashboard-order .order-header {
    background-color: #cacbd1;
    height: 40px;
    color: #fff;
    width: 100%;
    display: block;
    line-height: 40px;
    margin: 0;
    padding: 0 15px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    position: relative;
    z-index: 9;
}

#dashboard-order .order-info {
    clear: both;
    border: 2px #f8f8f8 solid;
    border-top: none;
    color: #434343;
    padding: 0 13px;
}

#dashboard-order .order-time {
    padding: 8px 0;
    border-bottom: 1px #eff2f6 solid;
    color: #b3b6be;
}

#dashboard-order .item-detail {
    border-bottom: 1px #eff2f6 solid;
    margin-bottom: 8px;
    padding: 10px 0;
}

#dashboard-order .item-detail .item {
    padding: 4px 2px;
    overflow: hidden;
    height: auto;
    font-size: 13px;
}

#dashboard-order .item-detail .title {
    float: left;
    color: #a7a7a7;
}

#dashboard-order .item-detail .value {
    float: right;
    color: #434343;
}

#dashboard-order .order-bottom {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAHCAYAAAA8sqwkAAAABGdBTUEAALGPC/xhBQAAALlJREFUGBlNkL8KwkAMxnPXcMVZcOjgG/j+b+EmXdVBVNDFQbher/4SrmAg9Mv3JxcaFkpazfMsOWeptToTY5SUknRdt1okWIByYylFwBn12xybEEJSVQ+CRU2wrdM0VTZe6SdUaQFlwQ5tzxz7vhc1szXGE+SZLZGTggXg7PUH3AfPwV8gLYAbdx7tdjOb0QItuKC9CW7xDmopaoS4g/1EW2sks4uMBTjSgxsAF/QXX5/B65/7D5hHfhpFbrWEE9XoAAAAAElFTkSuQmCC)  repeat-x bottom;
    margin-left: -13px;
    margin-right: -13px;
    padding: 0 13px 15px;
    height: auto;
    overflow: hidden;
}

.order-status .status {
    color: #e6a23c;
    margin-bottom: 0;
}

.order-status-1 .status,
.order-status-3 .status,
.order-status-5 .status {
    color: #3c763d;
}

.order-status-2 .status,
.order-status-7 .status {
    color: #a94442;
}

#dashboard-order .order-bottom .status {
    float: left;
}

#dashboard-order .order-bottom .view {
    float: right;
    color: #42a5f5;
}

#order-detail .detail {
    background: #f6f9fe;
    padding: 30px 0;
}

#order-detail .head {
    text-align: center;
    margin-bottom: 20px;
}

#order-detail .head .price {
    color: #237aff;
    font-weight: bold;
    font-size: 20px;
}

#order-detail .head .ori-price {
    color: #999;
    text-decoration: line-through;
    font-size: 14px;
    margin-top: -10px;
}

#order-detail .item {
    padding: 4px 0;
    color: #484848;
}

#order-detail .title {
    text-align: right;
    padding-right: 10px;
    color: #999;
}

#order-detail .value {
    text-align: left;
    padding-left: 30px;
    font-size: 13px;
}

#order-detail .btns {
    text-align: center;
    margin-top: 25px;
}

#order-detail .btns a {
    display: inline-block;
    margin: 0 10px;
    padding-bottom: 0;
    color: #237aff;
}

#dashboard-nav {
    background-color: #f6f9fe;
    padding-top: 0;
    padding-bottom: 0;
}

#dashboard-nav a {
    color: #666;
    padding: 15px 20px;
    font-size: 15px;
}

#dashboard-nav a:hover {
    background-color: rgba(36, 122, 255, .15);
    color: #247aff;
    border-radius: 0;
}

#dashboard-nav .router-link-active,
#dashboard-nav li a:focus {
    color: #247aff;
    font-weight: bold;
    border-radius: 0;
    background: rgba(36, 122, 255, .15);
}

/* "0":'绛夊緟浠樻',
"1":'浠樻瀹屾垚',
"2":'璁㈠崟鍙栨秷',
"3":'璁惧鍒嗛厤鎴愬姛',
"4":'璁惧鍒嗛厤澶辫触',
"5":'鍏呭€煎鐞嗘垚鍔�',
"6":'鍏呭€煎鐞嗗け璐�', */
#dashboard-order .item-detail .status3,
#dashboard-order .item-detail .status5 {
    color: #67c23a;
}

#dashboard-order .item-detail .status2,
#dashboard-order .item-detail .status4,
#dashboard-order .item-detail .status6 {
    color: #f56c6c;
}

#plan-list {
    overflow: hidden;
    height: auto;
}

#plan h4::before {
    content: " ";
    background: #237aff;
    width: 3px;
    display: inline-block;
    height: 14px;
    margin-right: 6px;
}

#plan-list .plan-item {
    width: 25%;
    padding-right: 15px;
    float: left;
    cursor: pointer;
}

#plan-list .plan-item .item {
    background-color: #f5f9ff;
    padding: 15px 35px;
    text-align: center;
    border: 1px #247aff solid;
    border-radius: 3px;
    margin-bottom: 15px;
    position: relative;
    z-index: 98;
}

#plan-list .plan-item .item .xbadge {
    position: absolute;
    width: 50px;
    height: auto;
    right: -1px;
    top: -1px;
    z-index: 999;
}

#plan-list .plan-item .item.active {
    background-color: #237aff;
    color: #fff;
}

#plan-list .plan-item h3 {
    margin-bottom: 0;
    font-family: Arial;
    font-weight: bold;
    font-size: 22px;
}

#plan-list .plan-item .usingtime {
    font-size: 15px;
    margin-bottom: 16px;
    padding-top: 5px;
}

#plan-list .plan-item .price {
    color: #237aff;
    font-size: 20px;
    font-weight: bold;
}

#plan-list .plan-item .oriPrice {
    color: #545454;
    text-decoration: line-through;
}

#plan-list .plan-item .oriPrice span,
#plan-list .plan-item .unit {
    color: #bababa;
}

#plan-list .plan-item .active .price,
#plan-list .plan-item .active .oriPrice span,
#plan-list .plan-item .active .unit,
#plan-list .plan-item .active .oriPrice {
    color: #fff;
}

.mypager li a {
    color: #237aff;
}

#pay-info {
    position: fixed;
    background: #fff;
    z-index: 100;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    text-align: center;
    padding-top: 100px;
    padding-left: 20px;
    box-sizing: border-box;
    padding-right: 20px;
}

#pay-info .info {
    background-color: #ebf3fe;
    border-radius: 5px;
    padding: 24px 20px;
    margin: 0 auto 50px;
    max-width: 380px;
}

#pay-info .info .row {
    padding: 8px 0;
}

#pay-info .info .title {
    color: #bcc3d0;
    text-align: left;
}

#pay-info .info .value {
    color: #434343;
    text-align: right;
}

#plan-cancel-pay {
    width: 150px;
    border-radius: 17px;
    margin-top: 30px;
}

#account-area {
    margin-bottom: 10px;
}

#account-area span {
    color: #237aff;
    font-weight: bold;
}

#account-area .edit {
    background-color: #237aff;
    color: #fff;
    padding: 0 5px;
    border-radius: 3px;
}

#account-area-select {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: rgba(0, 0, 0, .35);
    z-index: 99999;
    display: none;
}

#account-area-select .select-dialog {
    width: 530px;
    background: #fff;
    margin: 0 auto;
    padding: 50px 100px;
    margin-top: 180px;
    z-index: 999991;
}

#account-area-select .btn {
    background-color: #e4effe;
    display: block;
    width: 100%;
    margin-bottom: 15px;
    color: #484848;
}

#account-area-select .node-list {
    margin: 30px 0;
}

#account-area-select .btn:hover {
    background-color: #237aff;
    color: #fff;
}

#account-area-select .btn:focus {
    outline: none;
}

#account-area-select .title {
    text-align: center;
    font-weight: bold;
    font-size: 20px;
}

#dashboard-left .close-left,
.dashboard-menu-btn {
    display: none;
}

#dashboard-left {
    display: block;
}

.myloading {
    position: absolute;
    background: #f6f9fe;
    height: 100%;
    z-index: 999;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #247aff;
    flex-direction: column;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
}

.spinner {
    width: 40px;
    height: 40px;
    position: relative;
    margin: 10px auto;
}

.double-bounce1,
.double-bounce2 {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #247aff;
    opacity: .6;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: sk-bounce 2s infinite ease-in-out;
    animation: sk-bounce 2s infinite ease-in-out;
}

.double-bounce2 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

@-webkit-keyframes sk-bounce {
    0%,
    100% {
        -webkit-transform: scale(0);
    }

    50% {
        -webkit-transform: scale(1);
    }
}

@keyframes sk-bounce {
    0%,
    100% {
        transform: scale(0);
        -webkit-transform: scale(0);
    }

    50% {
        transform: scale(1);
        -webkit-transform: scale(1);
    }
}

.download-qrcode {
    padding-top: 25px;
    display: none;
}

.download-qrcode img {
    margin: 0 auto;
}

#pay-coupon {
    display: block;
}

#authorization-add,
#authorization-use {
    color: #434343;
}

#authorization-add label,
#authorization-use label {
    font-weight: normal;
}

#authorization-add .input .form-control,
#authorization-use .input .form-control {
    width: 35%;
}

#authorization-add .input-group {
    width: 35%;
}

#authorization-add .input-group .form-control {
    width: 100%;
}

#authorization-add .agreement a,
#authorization-use .agreement a {
    color: #237aff;
}

.pointer,
.pointer input {
    cursor: pointer;
}

.grant-status {
    display: inline-block;
    padding: 0 10px;
}

.grant-status-1 {
    color: #ffaf00;
}

.grant-status-2 {
    color: #ffaf00;
}

.label-copy {
    margin-left: 8px;
    padding: 1px 5px;
    font-size: 12px;
    background: #bcc3d0;
    cursor: pointer;
    font-weight: normal;
}

#preview-mode-wrapper {
    overflow: hidden;
    box-shadow: 0 0 5px #bbb;
    position: relative;
    border-radius: 7px;

    /* z-index: 10004; */
    min-width: 264px;
    min-height: 533px;
}

.expire-tips {
    height: 100%;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 10002;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.expire-tips > p {
    margin-bottom: 15px;
}

#dashboard-phone .list-style-list .grant-status {
    /* position: absolute; */

    /* top: 0px; */

    /* right: 0px; */
    color: #fff;
    float: right;
    margin-right: -10px;
}

#dashboard-phone .list-style-list .grant-status-1 {
    background-color: #ffaf00;
}

#dashboard-phone .list-style-list .grant-status-2 {
    background-color: #237aff;
}

#nav-avatar {
    float: left;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-left: 10px;

    /* overflow: hidden; */
    margin-top: 6px;
    display: none;
    text-align: center;
    line-height: 40px;
    background: #ccc;
    color: #fff;
    font-size: 18px;
    position: relative;
}

#nav-avatar img {
    min-width: 100%;
    min-height: 100%;
    border-radius: 50%;
}

#messages-list .message-item {
    height: 160px;
    padding: 15px 13px 0;
}

#messages-list .message-item .title {
    padding-bottom: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: bold;
    color: #000;
    position: relative;
}

#messages-list .message-item .content {
    height: 82px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

#messages-list .message-item .footer {
    overflow: hidden;
    height: 30px;
    line-height: 30px;
}

.reddot::after {
    content: " ";
    position: absolute;
    top: 21px;
    right: 5px;
    padding: 3px;
    z-index: 10000;
    background: #d9534f;
    border-radius: 50%;
    font-size: 0;
    line-height: 0;
    border: 1px solid #d43f3a;
}

#messages-list .message-item .title::after {
    right: 0;
    top: 5px;
}

#dashboard-nav .messages::after {
    right: 15px;
}

#nav-avatar.reddot::after {
    top: -2px;
    right: -3px;
}

#dashboard-left .user-panel {
    margin-bottom: 0;
    background: url(/media/static/images/dashboard-menu-bg.png) no-repeat;
    border-radius: 0;
    background-size: cover;
    color: #fff;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    cursor: pointer;
}

#profile .avatar {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border-radius: 50%;
    display: inline-block;
}

#profile .avatar img {
    width: 100%;
    min-height: 100%;
}

#profile .avatar .glyphicon-user {
    width: 100%;
    height: 100%;
    display: inline-block;
    text-align: center;
    line-height: 50px;
    background: #fff;
    font-size: 25px;
    color: #ccc;
}

#profile.my-panel {
    width: 400px;

    /* margin: 0px auto; */
}

.cell {
    padding: 0 10px;
}

.cell .row,
.cell .title,
.cell .value {
    display: flex;
    align-items: center;
    padding: 0;
}

.cell .value {
    justify-content: flex-end;
    cursor: pointer;
    color: #a7a7a7;
}

.cell .row {
    border-bottom: 1px #eee solid;
    padding: 13px 5px;
}

.cell .row:last-child {
    border-bottom: none;
}

.cell .row .value .glyphicon-menu-right {
    margin-left: 8px;
}

.mycheckbox {
    width: 52px;
    background: #fff;
    border: 2px #d3d5db solid;
    display: block;
    height: 32px;
    border-radius: 16px;
    position: relative;
    cursor: pointer;
}

.mycheckbox::after {
    content: " ";
    display: block;
    width: 25px;
    height: 25px;
    background: #fff;
    border-radius: 50%;
    position: absolute;
    top: 1.5px;
    box-shadow: 1px 1px 5px #aaa;
    left: 2px;
    transition: left .5s;
}

.mycheckbox.on {
    background: #247aff;
    border-color: #247aff;
}

.mycheckbox.on::after {
    left: 22px;
}

#account-device-lock .tips {
    color: #ccc;
    font-size: 13px;
}

#account-device-list > .row {
    padding: 10px 5px;
    height: 53px;
}

#account-device-list > .row .title {
    font-size: 14px;
    color: #434343;
    display: block;
}

#account-device-list > .row .title .model {
    color: #a7a7a7;
    margin: 0;
    font-size: 12px;
}

#account-device-list > .row .value {
    color: #ccc;
    cursor: pointer;
}

#add2ScreenTips {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .75);
    z-index: 10010;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #fff;
}

#add2ScreenTips p {
    font-size: 20px;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
}

#add2ScreenTips .title {
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 35px;
}

#add2ScreenTips .btn {
    background: #fff;
    color: #237aff;
    padding: 6px 30px;
    font-size: 18px;
    margin-top: 30px;
    outline: none;
}

.nophone-tips {
    margin-top: 25px;
    cursor: pointer;
}

.nophone-tips .buy img {
    width: 68px;
}

.nophone-tips .buy {
    width: 240px;
    height: 426px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    box-shadow: 0 0 6px #cecece;
    border-radius: 8px;
    margin: 0 auto;
}

.nophone-tips .buy p {
    color: #666;
    font-size: 13px;
    margin-top: 10px;
}

.fb_dialog {
    z-index: 10000 !important;
}

#dashboard-free-trial h4 {
    font-size: 14px;
    font-weight: bold;
}

#reward-tips {
    margin-bottom: 12px;
    cursor: pointer;
}

#reward-list .item {
    background-color: #f8fbff;
    margin-bottom: 12px;
    padding: 7px 15px;
    display: flex;
    border-radius: 3px;
}

#reward-list .item .left {
    max-width: 130px;
}

#reward-list .item .ptitle {
    color: #237aff;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#reward-list .item .date {
    color: #b8b8b8;
    margin: 0;
    font-size: 13px;
}

#reward-list .item .right {
    display: flex;
    flex: 1;
    text-align: right;
    justify-content: center;
    flex-direction: column;
    overflow: hidden;
}

#reward-list .item .right .reward-content {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin: 0;
    padding-left: 5px;
}

#vip-category {
    margin-bottom: 15px;
}

#plan h4 {
    margin-top: 30px;
}

#select-pad-title {
    margin-top: 0 !important;
}

#vip-category .item {
    background-color: #f5f9ff;
    text-align: center;
    display: inline-block;
    padding: 10px 80px;
    margin-right: 10px;
    margin-bottom: 10px;
    cursor: pointer;
    border-radius: 3px;
    border: 1px #237aff solid;
    font-size: 20px;
    color: #237aff;
}

#vip-category .item:hover {
    text-decoration: none;
}

#vip-category .item.active {
    background-color: #237aff;
    color: #fff;
}

#create-order {
    margin-bottom: 25px;
}

#footer .links {
    display: flex;
    flex-flow: row wrap;
}

.h5app-btn {
    color: #fff;
    background: #247aff;
    padding: 13px 15px;
    border-radius: 5px;
    border: 1px #fff solid;
}

.h5app-btn:hover {
    text-decoration: none;

    /* border-color: #247aff; */
}

#footer-card-try-free {
    background: linear-gradient(270deg, #416dff 0%, #209eff 100%);
    display: inline-block;
    position: relative;
    color: #fff;
    font-weight: bold;
    padding: 10px 70px;
    border: none;
    border-radius: 8px;
    overflow: hidden;
}

#footer-card-try-free img {
    position: absolute;
    top: 0;
    right: 0;
    width: 35px;
}

@media (max-width: 1200px) {
    .navbar-brand img {
        height: 35px;
    }
}

@media (max-width: 1000px) {
    #navbar {
        padding: 5px;
    }

    .navbar-brand {
        padding: 8px;
    }

    .navbar-brand img {
        height: 30px;
    }
}

@media (max-width: 768px) {
    .glide-icon {
        display: block;
    }

    #product-cover .word-title {
        width: 100%;
    }

    #product-cover .shape {
        display: block;
    }

    .posts-list-wrapper {
        padding: 0;
    }

    .posts-thumb-list li {
        padding: 13px;
    }

    .posts-thumb-list article {
        flex-direction: column;
    }

    .posts-thumb-list article .cover {
        margin-bottom: 20px;
    }

    .posts-thumb-list article h2 {
        font-size: 18px;
        font-weight: bold;
    }

    .posts-thumb-list .short-desc {
        max-height: 50px;
        overflow: hidden;
        line-height: 23px;
    }

    .nophone-tips .buy {
        width: 330px;
        height: 545px;
    }

    #profile.my-panel {
        width: 100%;
    }

    #nav-avatar {
        display: block;
    }

    .myloading {
        position: fixed;
    }

    #vip-category .item {
        padding: 3px 30px;
    }

    .reward-dialog {
        width: 100%;
        left: 0 !important;
        bottom: 0 !important;
        top: auto !important;
        border-radius: 13px 13px 0 0;
        padding: 10px 25px;
    }

    .reward-dialog .footer {
        text-align: center;
    }

    .reward-dialog .footer a {
        padding: 10px;
        background: #247aff;
        color: #fff;
        width: 100%;
        display: block;
        border-radius: 3px;
    }

    #login-history-items .wrapper {
        margin-bottom: 18px;
    }

    .phone-action-rotation {
        display: none;
    }

    #login-info-detail {
        width: 100%;
    }

    .mytab .item {
        width: 50%;
        margin: 0;
        text-align: center;
    }

    #redfinger-phone {
        margin: 0;
    }

    #dashboard-phone .list-style-preview {
        padding: 15px 0;
    }

    #preview-mode .topbar-content {
        left: -5.5px;
    }

    #authorization .block-box .value {
        padding-right: 35px;
    }

    #authorization-add .input .form-control,
    #authorization-add .input-group,
    #authorization-use .input .form-control {
        width: 100%;
    }

    .block-box .value {
        text-align: right;
    }

    .navbar-brand.pockm img {
        width: 90px;
        height: auto;
    }

    #dashboard-phone .right {
        padding: 0;
    }

    /* #dashboard-phone .btn-list {
        text-align: center;
        padding: 10px 0px;
    } */

    #play-loading {
        top: 0 !important;
    }

    /* #mask {
        background: rgba(0, 0, 0, 0.65)!important;
    } */

    #nav-lang {
        float: none;
    }

    .cover-img {
        display: none;
    }

    nav .download {
        text-align: center;
    }

    #nav-lang .dropdown {
        height: auto;
        overflow: hidden;
        border: none;
        min-height: 55px;
    }

    .navbar-nav > li > a {
        padding: 12px 15px;
    }

    #nav-lang.in .dropdown-menu {
        display: block;
        position: relative;
        width: 100%;
        box-shadow: none;
        border: none;
        margin-top: 0;
    }

    .navbar-nav > li,
    .dropdown-menu > li {
        border-bottom: 1px #eee solid;
    }

    .more-action > li {
        border-bottom: none;
    }

    #dashboard-phone .phone-item {
        padding-left: 10px;
        padding-right: 10px;
    }

    #dashboard-phone .phone-item .phone {
        padding: 0;
    }

    #product-cover {
        padding: 140px 0 60px;
        min-height: auto;
        background-image: url(/media/static/images/2x/home/phone-bg.png);
        background-repeat: no-repeat;
        background-size: contain;
    }

    #product-cover h1 {
        font-size: 24px;
        font-weight: bold;
        font-family: Arial-BoldMT, Arial;
        color: #434c6f;
        line-height: 35px;
        margin: 0 0 15px;
    }

    #product-cover h2 {
        font-size: 17px;
        font-family: ArialMT;
        color: #434c6f;
        line-height: 25px;
        margin: 15px 0;
    }

    #product-cover .description {
        width: auto;
        font-size: 13px;
        color: rgba(67, 76, 111, .6);
        line-height: 19px;
    }

    #product-cover .download {
        margin-top: 100px;
    }

    #product-cover .download a {
        display: block;
        width: 205px;
        margin: 0 auto 13px !important;
        margin-left: auto !important;
    }

    #product-cover .download .other {
        overflow: hidden;
    }

    #future .col-md-4 {
        margin-bottom: 30px;
    }

    #future-list .header h2 {
        font-size: 20px;
    }

    #six-reasons .item {
        padding-bottom: 50px;
        border-bottom: 1px #ccc dashed;
        margin-bottom: 30px;
    }

    #six-reasons .item:last-child {
        border-bottom: none;
    }

    #future-list .item h3 {
        font-size: 16px;
        font-weight: bold;
        text-align: center;
    }

    #future-list .pic img {
        width: 120px;
        height: auto;
    }

    #footer-download {
        padding: 20px;
    }

    #footer-download .intro {
        text-align: left;
    }

    #footer .social {
        padding-right: 20px;
    }

    .posts-content ol,
    .posts-content ul {
        margin-left: 0;
    }

    .posts-userbook-content {
        padding-left: 15px;
    }

    .inposts-link,
    .callout {
        padding: 15px;
    }

    #plan-list .plan-item {
        width: 100%;
        padding-right: 0;
    }

    #plan-list .plan-item .item {
        overflow: hidden;
        height: auto;
        padding: 10px 35px;
        min-height: 102px;
    }

    #plan-list .plan-item h3 {
        margin: 0;
        font-size: 23px;
    }

    #plan-list .plan-item .price {
        float: right;
        margin: 5px 0;
        font-size: 18px;
    }

    #plan-list .plan-item .oriPrice {
        float: left;
        height: 28px;
        line-height: 28px;
        margin: 5px 0;
    }

    #plan-list .plan-item .unit {
        clear: both;
        margin: 0;
        padding: 0;
        font-size: 12px;
    }

    #plan-list .plan-item .usingtime {
        display: none;
    }

    #account-area-select .select-dialog {
        width: 100%;
        padding: 50px 22px;
    }

    #dashboard {
        padding-left: 0;
        padding-right: 0;
    }

    #dashboard-left {
        position: fixed;

        /* left: 0px; */
        top: 0;
        z-index: 10010;
        bottom: 0;

        /* width: 70%; */

        /* padding-top: 30px; */
        background: #fff;

        /* display: none; */

        /* border-right: 1px #eee solid; */
        width: 288px;
        padding: 0;
        left: -288px;
        transition: left .5s;
    }

    #dashboard-left.animate {
        left: 0;
    }

    #dashboard-left .user-panel {
        border-radius: 0;
    }

    #dashboard-left .user-panel .glyphicon-menu-right {
        font-size: 16px;
        position: absolute;
        right: 20px;
        top: 62px;
    }

    #dashboard-nav {
        background: #fff;
    }

    #dashboard-left .panel-heading {
        display: none;
    }

    #dashboard-left .close-left {
        position: absolute;
        right: 5px;
        top: 5px;
        font-size: 19px;
        color: #fff;
        display: block;
        z-index: 10010;
    }

    .user-panel .email {
        width: 135px;
    }

    .dashboard-menu-btn,
    .dashboard-menu-btn:focus,
    .dashboard-menu-btn:hover {
        background: #4b97ec;
        color: #fff;
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        border-radius: 50%;
        position: fixed;
        top: 95px;
        right: 20px;
        font-size: 18px;
        z-index: 9998;
        box-shadow: 0 1px 12px 0 rgba(46, 155, 255, .74);
        outline: none;
        text-decoration: none;
        display: block;
    }

    /* 鏂版寜閽牱寮弒tart */

    #product-cover .newcontent {
        margin-top: 54px;
        padding: 0 34px;
    }

    #product-cover .download .browser {
        width: 100%;
        height: 45px;
        border-radius: 7px;
        font-size: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .btn-box {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    #product-cover .download .btn-new-gp {
        width: 100%;
        height: 45px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* 鏂版寜閽牱寮廵nd */
}

@media (max-width: 375px) {
    .btn-hyper-gp {
        margin-left: 0;
    }

    #product-cover {
        min-height: 600px;
    }

    #preview-mode {
        width: 264px;
    }
}

@media (width: 768px) {
    .container > .navbar-collapse {
        display: none !important;
    }

    .navbar-toggle {
        display: block;
    }

    .container > .navbar-header {
        float: none;
    }

    .navbar-collapse.in {
        overflow-y: visible;
        display: block !important;
    }
}

@media (max-height: 700px) {
    #right-btns .func-action li {
        margin: 5px 0;
    }
}

@media (max-width: 1600px) {
    .cover-img {
        width: 50%;
        right: -2%;
        top: 1%;
    }
}

@media (max-width: 1300px) {
    .cover-img {
        width: 45%;
        right: 0;
        top: 6%;
    }
}

@media (max-width: 1200px) {
    .cover-img {
        width: 45%;
        right: -6%;
        top: 20%;
    }
}

@media (max-width: 1100px) {
    .cover-img {
        width: 30%;
        right: 2%;
        top: 40%;
    }
}

@media (max-width: 1000px) {
    .cover-img {
        width: 30%;
        right: 0;
        top: 40%;
    }
}

.btn-hide {
    display: none !important;
}