/*
base style sheet 
version:2014/08/11(v0.0.0.1)
update :2014/11/11(v0.0.0.5) qbrao
website:https://bssn.go.id
*/
@font-face {
    font-family: 'Open Sans';
    src: url('opensans-regular-webfont.woff') format("woff");
}

/*@font-face{*/
/*font-family: 'Han Sans';*/
/*src: url('SourceHanSansCN-Regular.woff') format("woff");*/
/*}*/
html {
    overflow-y: auto;
    background: #edf0f5;
    color: #333;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
fieldset,
legend,
button,
input,
textarea,
form,
th,
td {
    margin: 0;
    padding: 0;
}

body,
button,
input,
select,
textarea {
    font: 14px/1.5 "Open Sans", 'Arial', "SimHei", sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: 100%;
}

address,
cite,
dfn,
em,
var {
    font-style: normal;
}

code,
kbd,
pre,
samp,
tt {
    font-family: "Courier New", Courier, monospace;
}

small {
    font-size: 12px;
}

ul,
ol {
    list-style: none;
}

a {
    text-decoration: none;
    color: #207dcb;
}

a:hover {
    text-decoration: underline;
}

q:before,
q:after {
    content: '';
}

legend {
    color: #000;
}

fieldset,
img,
iframe {
    border: none;
}

button,
input,
select,
textarea {
    font-size: 100%;
}

textarea {
    resize: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

hr {
    border: none;
    height: 1px;
}

a,
input,
textarea,
button {
    outline: none;
}

input {
    color: #333;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #999;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #999;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #999;
}

input[type="reset"]::-moz-focus-inner,
/*  */
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"]>input[type="button"]::-moz-focus-inner {
    border: none;
    padding: 0;
}

.clear {
    display: block;
    clear: both;
    height: 0;
    overflow: hidden;
    font-size: 0;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: '';
    clear: both;
    height: 0;
}

.w-1000 {
    width: 1000px;
    position: relative;
    margin: 0 auto;
}

.search-btn a b,
.tool-box b,
.files-freeze-ico,
.filter-top ul li b,
.upload em,
.files-list ul li em,
.viewed-files ul li em,
.page-pre b,
.page-next b,
.control-box ul li,
.arr-title,
.share-record-title .arr-title,
.progress-status i,
.share-people .ico-add-people,
.up-cancel,
.m-ico,
/* files */
.repeat-box-arr,
.btn-add-people,
.advanced-box h3 p b,
.btn-repeat s,
.btn-repeat-fixed s,
.joiner-item span.del,
/* meeting schedule */
.btn-more-filter b,
.btn-meeting-calendar a i,
.btn-meeting-search a,
.meeting-hour b,
.ico-border,
.code-img b,
.btn-meeting-del,
.meeting-list-main .meeting-tool .tool-bar .ico-edit,
.ico-repeat-meeting,
.ico-repeat-meeting-x,
.fc-toolbar .fc-icon,
.meeting-list-main .meeting-tool .meeting-status b,
.meeting-history-main .meeting-info dl dd span i,
.btn-schedule-meeting,
/* meeting */
.btn-exchange,
.steps ol li b,
.bulletin-list ul li .ico-del,
/* set */
.meeting-status b,
.tool-bar .btn-meeting-del,
.meeting-side-tool .tool-bar b,
.meeting-side-tool .tool-bar .ico-edit,
.meeting-side-tool .tool-bar .ico-cancel,
.meeting-detail-box h2 .ico-repeat-meeting,
.meeting-joiner-box span i,
.ico-down-arr,
.ico-up-arr,
/* meeting detail */
.contacts-group-div .change-group-div span.ico-change-group,
.group-tool span,
.group-sure-cancel span,
.btn-add-item,
.btn-del-item,
.ico-group-arr,
.name-rank b,
.contacts-title a,
/* contacts */
.ico-success,
.ico-warn,
.msg-box i,
/* pop */
.alert-close,
/* alert-box */
.pop-close-ico,
.pop-close-ico-alert,
.icons,
.arr-box .ico-arr,
.selectbox .ico-arr,
.ico-txt-right,
.tip-box b,
.videoParamTip .angle

/* base */
    {
    display: inline-block;
    position: relative;
    width: 18px;
    height: 18px;
    background: url("../img/base/ico.png?1.0.14.9") no-repeat;
}

.top-bar {
    position: relative;
    top: 0;
    left: 0;
    z-index: 2;
    width: 100%;
    min-width: 1000px;
    height: 50px;
    padding: 20px 0;
    background: #21446d;
}

.top-bar .w-1000 {
    z-index: 2;
}

.logo {
    float: left;
    height: 25px;
    padding: 0 34px 0 0;
    margin: 13px 40px 0 0;
    border-right: 1px solid #909fb4;
    font: 700 28px/25px "\5fae\8f6f\96c5\9ed1";
    color: #c6e0fa;
}

.logo b {
    background-position: -161px -550px;
    width: 220px;
    height: 40px;
    background-image: url("../img/conference/icon.png?1.0.14.9");
    background-repeat: no-repeat;
    display: inline-block;
}

.user-info {
    position: relative;
    float: right;
    max-width: 215px;
    height: 39px;
    padding: 5px 0 20px;
    zoom: 1;
}

.user-info:hover .user-hide-panel {
    display: block;
}

.top-user-img {
    display: inline-block;
    position: relative;
    width: 36px;
    height: 36px;
    border: 2px solid #557a97;
    border-radius: 19px;
    vertical-align: middle;
}

.top-user-img img {
    width: 36px;
    height: 36px;
    vertical-align: bottom;
    cursor: pointer;
    border-radius: 19px;
}

.top-user-img b.ico-vip {
    display: inline-block;
    position: absolute;
    top: -5px;
    right: -18px;
    width: 30px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    border-radius: 2px;
    color: #fff;
    font-weight: 400;
    background: #f36705;
}

.top-user-name {
    display: inline-block;
    position: relative;
    top: 8px;
    max-width: 160px;
    padding: 0 0 0 6px;
    color: #fff;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.msg_ico {
    position: absolute;
    top: -5px;
    right: -5px;
    cursor: pointer;
}

.msg_ico a {
    display: block;
    width: 18px;
    height: 18px;
    zoom: 1;
}

.msg_ico b {
    display: block;
    position: absolute;
    width: 18px;
    height: 18px;
    line-height: 18px;
    background: #ff5a00;
    border-radius: 9px;
    text-align: center;
    color: #fff;
    font-weight: 400;
    font-size: 12px;
}

.user-hide-panel {
    display: none;
    position: absolute;
    top: 50px;
    left: 0;
    width: 110px;
    background: #fff;
    border: 1px solid #c1c1c1;
    border-radius: 3px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
}

.user-hide-panel ul li {
    position: relative;
    height: 28px;
    line-height: 28px;
}

.user-hide-panel ul li a {
    display: block;
    padding: 0 0 0 8px;
    border-radius: 3px;
    color: #666;
}

.user-hide-panel ul li a:hover {
    background: #dcf2fc;
    text-decoration: none;
}

.user-hide-panel ul li a b {
    display: none;
    position: relative;
    left: 5px;
    top: -1px;
    width: 6px;
    height: 6px;
    border-radius: 6px;
    background: #ff5a00;
}

.btn-join-meeting {
    float: right;
    height: 30px;
    padding: 15px 0 0;
    margin: 0 10px 0 0;
}

.btn-join-meeting a {
    display: block;
    padding: 0 8px;
    line-height: 30px;
    border-radius: 2px;
    text-align: center;
    color: #fff;
    background: #1f7dcb;
}

.btn-join-meeting a:hover {
    text-decoration: none;
    background: #258de4;
}

.top-bar .bg-left,
.top-bar .bg-right {
    display: block;
    position: absolute;
    z-index: 1;
    top: 0;
    width: 1000px;
    height: 90px;
    background-image: url("../img/base/top-bg.jpg?1.0.14.9");
}

.top-bar .bg-left {
    background-position: 0 0;
    left: 0;
}

.top-bar .bg-right {
    background-position: 0 -90px;
    right: 0;
}

.main {
    position: relative;
    z-index: 1;
    min-height: 675px;
    padding: 0 0 1px;
    background: #fff;
}

.bottom {
    background: #3d434b;
}

.bottom-menu {
    padding: 0 0 0 50px;
}

.bottom-menu dl {
    float: left;
    padding: 16px 180px 0 0;
}

.bottom-menu dl.last-menu {
    padding-right: 0;
}

.bottom-menu dl dt {
    width: 180px;
    height: 40px;
    line-height: 40px;
    margin: 0 0 5px;
    border-bottom: 1px solid #666b71;
    color: #fff;
}

.bottom-menu dl dd a {
    color: #9d9fa2;
}

.copyright {
    padding: 20px 0 20px;
    text-align: center;
    color: #fff;
}

/* top login reg */
.top-login-reg {
    float: right;
    padding: 20px 0 0;
    color: #71b1d7;
}

.top-login-reg a {
    margin: 0 8px;
    color: #71b1d7;
}

/* alert */
.alert-box {
    width: 410px;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 999;
    background: rgba(255, 255, 255, .95);
    border-radius: 2px;
    box-shadow: 0 0 12px rgba(9, 2, 4, .45);
    word-wrap: break-word;
    /*border: 1px solid rgba(0,0,0,.24)*/
}

.alert-title {
    height: 32px;
    line-height: 32px;
    color: #fff;
    border-radius: 3px 3px 0 0;
    background: #278ac4;
    text-align: center;
    font-size: 16px;
}

.alert-bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    right: 0;
    z-index: 998;
    background: #000;
    opacity: .2;
    filter: alpha(opacity=20);
}

.alert-main {
    position: relative;
    /*margin-top: 20px;min-height: 20px;*/
}

.alert-content {
    position: relative;
    padding: 20px 26px 0;
    line-height: 24px;
}

.alert-mh {
    min-height: 117px;
}

.alert-tips {
    padding: 28px 0 48px;
    line-height: 24px;
}

.alert-tips-txt {
    padding: 0 0 0 29px;
}

.alert-bottom {
    text-align: center;
    padding: 30px 0;
}

.alert-bottom span {
    display: inline-block;
    min-width: 86px;
    padding: 0 15px;
    margin: 0 10px;
}

.alert-bg-opacity {
    opacity: 0 !important;
    filter: alpha(opacity=0) !important;
}

/**/
.warn-box .alert-title-white {
    height: 44px;
}

.popup-box .alert-title-white {
    height: 42px;
}

.alert-title-white {
    min-height: 35px;
    border-radius: 4px 4px 0 0;
    text-align: center;
    font-size: 16px;
}

.alert-title-white p {
    font-size: 16px;
    line-height: 30px;
    padding-top: 8px;
    text-align: center
}

.alert-title-white .alert-close,
.addFailed-close {
    background-image: url("../img/conference/webrtc_icon.png?1.0.14.9");
    background-position: -237px -407px;
    width: 36px;
    height: 36px;
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
}

.alert-title-white .alert-close:hover,
.addFailed-close:hover {
    background-position: -293px -407px;
}

.alert-title-white .alert-close:active,
.addFailed-close:active {
    background-position: -715px -718px;
}

.ico-success {
    float: left;
    width: 24px;
    height: 24px;
    background-position: 0 -144px;
    vertical-align: middle;
}

.ico-warn {
    float: left;
    width: 24px;
    height: 24px;
    background-position: -24px -144px;
    vertical-align: middle;
}

.alert-pwd-box .alert-title-white p {
    margin: 0 50px
}

.msg-box.msg-box-default {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1000;
    max-width: 450px;
    padding: 5px 10px 5px 5px;
    border: 1px solid #fbb787;
    background: #ffe1cc;
    border-radius: 3px;
    word-wrap: break-word;
}

.msg-box i {
    float: left;
    margin: 1px 0 0;
    background-position: -54px -162px;
}

/*.msg-box p{ padding: 0 0 0 20px;}*/
/*loading*/
.loading-bg {
    position: absolute;
    top: 0px;
    bottom: 0px;
    right: 0px;
    z-index: 1198;
    background: none repeat scroll 0% 0% #000;
    opacity: .4;
    filter: alpha(opacity=40);
    left: 0;
}

.loading-bg-opacity {
    opacity: 0 !important;
    filter: alpha(opacity=0) !important;
}

.loading-box {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1199;
}

.loading-with-content-box {
    background: none repeat scroll 0% 0% #FFF;
    border-radius: 3px;
    box-shadow: 0px 0px 12px rgba(9, 2, 4, 0.45);
    word-break: break-all;
    word-wrap: break-word;
}

.loading-box .content-text {
    padding: 15px 120px;
    text-align: center;
}

.loading-box .loading-icon-box {
    padding: 0 80px 15px 80px;
    text-align: center;
}

.loading-icon {
    width: 25px;
    height: 25px;
    display: inline-block;
    background: url("../img/conference/loading_share_list.gif?1.0.14.9") no-repeat;
}

.loading-no-content-box .loading-icon {
    width: 60px;
    height: 60px;
    display: inline-block;
    background: url("../img/conference/webrtc_video_loading0000.png?1.0.14.9") no-repeat scroll 0% 0% transparent;
    animation: loading 2s linear infinite;
}

/**/
@keyframes loading {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.loading-no-content-box {
    width: 65px;
    height: 65px;
}

/* pop */
.pop-box {
    width: 420px;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 999;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 0 12px rgba(9, 2, 4, .45);
    word-wrap: break-word;
}

.pop-title {
    height: 34px;
    line-height: 34px;
    color: #fff;
    border-radius: 3px 3px 0 0;
    background: #1f7dcb;
    text-align: center;
    font-size: 16px;
}

.pop-close-ico {
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 999;
    background-position: -72px -90px;
    cursor: pointer;
    transition: all 0.4s ease-in-out;
}

.pop-close-ico-alert {
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 999;
    background-position: -72px -90px;
    cursor: pointer;
    transition: all 0.4s ease-in-out;
}

.pop-close-ico:hover {
    /*-firtransform:rotate(180deg); -webkit-transform:rotate(180deg); transform:rotate(180deg);*/
}

.pop-bg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    right: 0;
    z-index: 998;
    background: #000;
    opacity: 0;
    filter: alpha(opacity=50);
}

.pop-main {
    position: relative;
    padding: 20px 26px 0;
}

.btn-click {
    background: #ccc;
    padding: 2px;
}

.pop-tip-txt {
    padding: 28px 0 48px;
    line-height: 24px;
}

.tip-p {
    padding: 0 0 0 29px;
}

/*  */
.pop-join-main {
    position: relative;
}

.input-style-two {
    padding: 8px 5px;
    border-radius: 3px;
    border: 1px solid #cecece;
}

.pop-join-main ul {
    padding: 45px 0 0 40px;
}

.pop-join-main ul li {
    padding: 0 0 15px;
}

.pop-join-main ul li img {
    width: 100px;
    height: 34px;
    margin: 0 0 0 10px;
    border: 1px solid #cecece;
    border-radius: 3px;
    cursor: pointer;
}

.btn-change-img {
    display: block;
    float: left;
    height: 34px;
    line-height: 34px;
    padding: 0 0 0 5px;
}

.pop-btn-box {
    text-align: center;
    padding: 10px 0 12px;
}

.pop-btn-box a {
    display: inline-block;
    width: 146px;
    height: 36px;
    line-height: 36px;
    margin: 0 10px;
    /*background: #1f7dcb; border:1px solid #1f7dcb; border-radius:2px; color: #fff;*/
}

.pop-btn-box a.disabled {
    background: #bbb;
    border: 1px solid #b3b3b3;
}

.tips {
    position: absolute;
    top: 10px;
    left: 40px;
    width: 397px;
    height: 24px;
    line-height: 24px;
}

.tips .error {
    background: #f74545;
    color: #fff;
    padding: 0 5px;
}

.mh-pop .pop-btn-box {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
}

.input-gname {
    width: 350px;
    height: 20px;
    line-height: 20px;
    padding: 5px 8px;
    border: 1px solid #bebebe;
    border-radius: 2px;
}

.textarea-pop1 {
    width: 350px;
    height: 273px;
    line-height: 20px;
    padding: 5px 8px;
    margin: 5px 0 0;
    border: 1px solid #bebebe;
    border-radius: 2px;
}

.textarea-pop2 {
    width: 350px;
    height: 198px;
    line-height: 20px;
    padding: 5px 8px;
    margin: 5px 0 0;
    border: 1px solid #bebebe;
    border-radius: 2px;
}

.font-count {
    margin: 0 0 5px;
}

.meeting-cancel-label {
    display: block;
    margin: 0 0 8px;
}

.meeting-cancel-label input {
    position: relative;
    top: -2px;
    margin: 0 5px 0 0;
    vertical-align: middle;
}

/**/
.control-tips {
    text-align: center;
    line-height: 30px;
    padding: 45px 40px 0;
}

.control-tips h2 {
    font-size: 16px;
}

.control-tips input {
    vertical-align: middle;
}

/* meeting msg */
.meeting-msg {
    position: fixed;
    bottom: 5px;
    right: 5px;
    z-index: 997;
    width: 300px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 0 0 12px rgba(9, 2, 4, .45);
    background: #ebf2f9;
}

.meeting-msg-main {
    position: relative;
    width: 280px;
    margin: 10px 10px 0;
    overflow: hidden;
}

.meeting-msg ul {
    position: relative;
    width: 99999px;
}

.meeting-msg ul li {
    position: relative;
    float: left;
    width: 280px;
    min-height: 117px;
    padding-bottom: 60px;
    overflow: hidden;
}

.multi-msg ul li {
    min-height: 117px;
    padding-bottom: 100px;
}

.meeting-msg .pop-btn-box {
    position: absolute;
    width: 100%;
    left: 0;
    bottom: 0;
}

.meeting-msg .pop-btn-box span {
    width: 146px;
    margin: 0 auto;
}

.multi-msg .pop-btn-box {
    bottom: 43px;
}

.msg-meeting-time span {
    height: 40px;
    visibility: hidden;
}

.msg-page {
    position: absolute;
    left: 0;
    bottom: 9px;
    width: 100%;
    height: 24px;
    padding: 9px 0 0;
    border-top: 1px solid #c9d6e3;
    color: #666;
    text-align: center;
}

.msg-page a {
    display: inline-block;
    position: relative;
    width: 24px;
    height: 18px;
    line-height: 18px;
    padding: 2px 0;
    border: 1px solid #c4c4c4;
    background: #fff;
    border-radius: 2px;
    cursor: pointer;
}

.msg-page a b {
    position: absolute;
    top: 2px;
    left: 3px;
}

.msg-page a.page-pre {
    margin: 0 10px 0 0;
}

.msg-page a:hover,
.page a.selected {
    text-decoration: none;
}

.msg-page a.page-pre b.page-pre-ico {
    background-position: -18px 0;
}

.msg-page a.page-next b.page-next-ico {
    background-position: -36px 0;
}

.msg-page a.disabled b.page-pre-ico {
    background-position: 0 0;
}

.msg-page a.disabled {
    background: #e8e8e8;
    border-color: #d4d4d4;
}

.msg-page a.disabled b.page-next-ico {
    background-position: -53px 0;
}

.msg-page a.disabled:hover {
    cursor: default;
}

.msg-page span {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    margin: 0 10px 0 0;
    vertical-align: top;
}

/* checkbox */
.checkbox {
    display: inline-block;
}

.checkbox span {
    margin: 0 0 0 5px;
    cursor: default;
}

.checkbox i {
    display: inline-block;
    position: relative;
    margin-top: -1px;
    vertical-align: middle;
    text-indent: -999em;
}

.icon-check {
    background-position: -90px -54px;
}

.icon-check-selected {
    background-position: -72px -54px;
}

.icon-check-mixed {
    background-position: -72px -72px;
}

.icon-check-disabled {
    background-position: -108px -198px;
}

.icon-check-disabled-s {
    background-position: -90px -198px;
}

/* selectbox */
.selectbox {
    display: inline-block;
    position: relative;
    z-index: 1;
    background: #fff;
    zoom: 1;
}

.s-current {
    z-index: 3;
}

.s-input-box {
    position: relative;
    z-index: 2;
    height: 30px;
    line-height: 30px;
    padding: 0 22px 0 4px;
    border: 1px solid #cfcfcf;
    border-radius: 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.s-hide-box {
    display: none;
    position: absolute;
    max-height: 200px;
    max-width: 600px;
    padding: 1px;
    overflow: auto;
    border: 1px solid #c1c1c1;
    border-radius: 2px;
    background: #fff;
    box-shadow: 0 0 5px rgba(9, 2, 4, .3);
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    .s-hide-box-border {
        border-right-width: 1px;
    }
}

.s-hide-box span {
    display: block;
    position: relative;
    height: 30px;
    line-height: 30px;
    padding: 0 5px;
    overflow: hidden;
    white-space: nowrap;
}

.s-hide-box span:hover {
    background: #dcf2fc;
    cursor: default;
}

/* arr box */
.arr-box {
    position: relative;
    float: left;
}

.arr-box input {
    position: relative;
    z-index: 2;
    background: none;
}

.arr-box .ico-arr,
.selectbox .ico-arr {
    position: absolute;
    top: 50%;
    right: 3px;
    z-index: 1;
    margin: -9px 0 0 0;
    background-position: -90px -90px;
}

/* btn
 text-shadow:1px 0 1px rgba(9,2,4,.2);
 */
.btn-normal,
.btn-yellow,
.btn-cyan,
.btn-green,
.btn-disabled {
    display: inline-block;
    height: 32px;
    line-height: 32px;
    font-size: 16px;
    text-align: center;
    cursor: pointer;
    border-radius: 2px;
}

.btn-normal:hover,
.btn-cyan:hover,
.btn-yellow:hover,
.btn-green:hover,
.btn-disabled:hover {
    text-decoration: none;
    cursor: pointer;
}

.btn-normal {
    background-color: #ffffff;
    color: #333;
    border: 1px solid #bdbdbd;
}

.btn-normal:hover {
    background-color: #efefef;
}

.btn-normal:active {
    background-color: #d7d7d7;
}

.btn-green {
    background: var(--main-blue);
    color: #ffffff;
}

.btn-green:hover {
    background: #3d94e8;
    cursor: pointer;
}

.btn-green:active {
    background: #297ed0;
    cursor: pointer;
}

.btn-red {
    background: #c85943;
    color: #ffffff;
    line-height: 32px;
    border-radius: 2px;
    font-size: 16px;
}

.btn-red:hover {
    background: #db624b;
    cursor: pointer;
}

.btn-red:active {
    background: #bc533e;
    cursor: pointer;
}

.btn-yellow {
    background: #fb7927;
    border: 1px solid #f2701e;
    color: #fff;
}

.btn-yellow:hover {
    background: #ff9f4c;
    border: 1px solid #f8933c;
}

.btn-yellow:active {
    background: #e56610;
    border: 1px solid #f2711d;
}

.btn-disabled {
    background: rgba(232, 232, 232, 0.3);
    border: 1px solid #dadada;
    color: rgba(0, 0, 0, 0.3);
}

.btn-disabled:hover {
    cursor: default;
}

/* placeholder box */
.placeholder-box {
    position: relative;
    cursor: text;
    zoom: 1;
    /*overflow: hidden;*/
    vertical-align: middle;
}

.placeholder-txt {
    position: absolute;
    top: 0;
    left: 0;
    width: 98%;
    line-height: 28px;
    text-indent: 6px;
    margin: 1px;
    background: #fff;
    color: #ccc;
    text-align: left
}

.placeholder {
    position: absolute;
    z-index: 888;
    color: #999;
    text-indent: 8px;
    cursor: text;
}

/* pop box */
.data-tips {
    width: 100%;
    padding: 170px 0 300px;
    text-align: center;
    background: #fff;
}

.ico-data-tips {
    display: inline-block;
    width: 53px;
    height: 37px;
    margin: 20px 0;
}

#loading {
    position: absolute;
    z-index: 997;
    width: 32px;
    height: 32px;
}

.tip-box,
.videoParamTip {
    position: absolute;
    z-index: 1001;
    /*padding:4px 7px;*/
    line-height: 22px;
    color: #e4e7e9;
    border-radius: 1px;
    word-wrap: break-word;
    box-shadow: 0 0 6px rgba(4, 0, 0, 0.3);
}

.tip-box b,
.videoParamTip .angle,
.share-state-arrow,
.lay-state-arrow {
    /*position: absolute; bottom: -6px; height: 6px; background-position: -108px -275px;*/
    border-top: 6px solid rgba(40, 42, 45, 0.90);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    bottom: -6px;
    width: 0px;
    height: 0px;
    position: absolute;
}

.tip-box b.top {
    background-image: url("../img/base/ico.png?1.0.14.9");
    background-repeat: no-repeat;
    background-position: -108px -274px;
    top: -5px;
    bottom: auto;
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
}

.tip-box i,
.videoParamTip i {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 1;
    border-radius: 2px;
}

/*opacity:0.7;*/
.tip-box p,
.tip-box div,
.videoParamTip p,
.videoParamTip {
    position: relative;
    z-index: 2;
    font-weight: normal;
    background: rgba(40, 42, 45, 0.90);
    color: #e4e7e9;
    border-radius: 1px
}

.tip-box p {
    white-space: nowrap;
}

.fs14 {
    font-size: 14px;
}

.fs16 {
    font-size: 16px;
}

.fs18 {
    font-size: 18px;
}

.fs22 {
    font-size: 22px;
}

.fb {
    font-weight: 700;
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.tc {
    text-align: center;
}

.tl {
    text-align: left;
}

.tr {
    text-align: right;
}

.dn {
    display: none;
}

.db {
    display: block;
}

.dib {
    display: inline-block;
}

.vh {
    visibility: hidden;
}

.oh {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.dib {
    display: inline-block;
}

.lh20 {
    line-height: 20px;
}

.lh24 {
    line-height: 24px;
}

.lh30 {
    line-height: 30px;
}

.c-000 {
    color: #000;
}

.c-03c {
    color: #03c;
}

.c-333 {
    color: #333;
}

.c-999 {
    color: #999;
}

.c-1f7 {
    color: #1f7dcb;
}

.c-f09 {
    color: #f09343;
}

.c-yellow {
    color: #ff6a07;
}

.mt12 {
    margin-top: 12px;
}

.mt18 {
    margin-top: 18px;
}

.ml80 {
    margin-left: 80px;
}

.mb25 {
    margin-bottom: 25px;
}

.mb10 {
    margin-bottom: 10px;
}

.mb20 {
    margin-bottom: 20px;
}

.mb8 {
    margin-bottom: 8px;
}

.mb15 {
    margin-bottom: 15px;
}

.mh-pop {
    min-height: 117px;
    padding-bottom: 60px;
}

.install {
    color: #000;
    margin-top: 20vh;
}

.downloadPlugin {
    margin: 32px 0;
}

.seperateLine {
    width: 1024px;
    height: 1px;
    border: 1px solid #ebebeb;
    border-bottom: none;
    margin: 32px auto;
}

.viewLink {
    text-decoration: underline;
}

.noUnderline {
    text-decoration: none;
}

.browserIcon {
    width: 188px;
    margin: 40px auto;
}

.browserLink {
    width: 350px;
    margin: 40px auto 30px;
}

.bg-pic {
    background-image: url("../img/conference/webrtc_icon.png?1.0.14.9");
    background-repeat: no-repeat;
}

.bg-plugin {
    background-position: -92px -692px;
    width: 33px;
    height: 33px;
    display: inline-block;
    vertical-align: middle;
}

.bg-firefox {
    background-position: -781px -137px;
    width: 46px;
    height: 46px;
    display: block;
    margin: auto;
}

.bg-chrome {
    background-position: -844px -137px;
    width: 46px;
    height: 46px;
    display: block;
    margin: auto;
}

.bg-firefoxLink {
    background-position: -781px -199px;
    width: 64px;
    height: 62px;
    display: block;
    margin: auto;
}

.bg-chromeLink {
    background-position: -859px -199px;
    width: 60px;
    height: 62px;
    display: block;
    margin: auto;
}