/*************************************首页tiles 添加图标背景***************************************************************/

div[data-id="whats-new"] > div > .wh_tile_image {
  background: url("../images/p-series/what-is-new-icon.png") no-repeat center;
}
div[data-id="administrator"] > div > .wh_tile_image {
  background: url("../images/p-series/administrator-guide-icon.png") no-repeat
    center;
}
div[data-id="developer"] > div > .wh_tile_image {
  background: url("../images/p-series/installtion-guide-icon.png") no-repeat
    center;
}

/*************************************2021.9.29 更新样式***************************************************************/

thead.thead {
  background-color: #eee;
}

/* 去除默认 图片hover 样式 */

img.image:not(img[usemap]) {
  opacity: 1 !important;
}

/* customized styles */

.tag-improved {
  background: #77be00;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 1rem;
}

.tag-new {
  background: #f5b40a;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 1rem;
}

.tag-deprecated {
  background: #646d71;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 1rem;
}

.tag-post {
  background: #2395f17d;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 1rem;
}

.tag-get {
  background: #77be0078;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 1rem;
}

.tag-put {
  background: #f5b40a85;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 1rem;
}

.tag-delete {
  background: #646d7180;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  font-size: 12px;
  margin-right: 1rem;
}

a[data-id="document-updates"]::after, a[data-id="whats-new"]::after {
  background: url(../images/new.svg) right no-repeat;
  content:"";
  display:inline-block;
  width: 40px;
  height: 18px;
  transition: all 0.3s;
  position: reletive;
  margin-left: 5px;
}

/*learning path styles*/

.rno-learning-path-item {
  position: relative;
  box-sizing: border-box;
}
.rno-learning-path-inner {
  padding-left: 80px;
  position: relative;
}
.rno-learning-path-inner::before {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #e3e8ed;
  position: absolute;
  left: 24px;
  top: 0;
  z-index: 5;
}

.rno-learning-path-wrap
  .rno-learning-path-item:last-child
  .rno-learning-path-inner::after {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #e1e6f0;
  position: absolute;
  left: 19.5px;
  bottom: 0;
}
.rno-learning-path-head {
  line-height: 32px;
  position: absolute;
  left: 8px;
  top: 0;
  z-index: 10;
}
.rno-learning-path-icon {
  width: 42px;
  height: 42px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 12px;
  border: 4px solid #fff;
  background-color: #fff;
}
.rno-learning-path-title {
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
  color: #333;
  line-height: 28px;
  font-weight: 500;
}
.rno-learning-path-item .rno-learning-path-section:last-child {
  padding-bottom: 48px;
}
.rno-learning-path-section {
  padding-top: 4px;
  padding-bottom: 20px;
  overflow: hidden;
}
.rno-learning-path-section-title {
  display: block;
  font-size: 16px;
  color: #000;
  line-height: 26px;
  font-weight: 400;
}

.learning-path-title {
  font-size: 20px;
  line-height: 36px;
  margin-top: 36px;
  margin-bottom: 16px;
  color: #3d4a59;
  margin-left: -2rem;
}
/* topic pse white label */
.pse-learning-path-item {
  position: relative;
  box-sizing: border-box;
}
.pse-learning-path-inner {
  padding-left: 70px;
  position: relative;
}
.pse-learning-path-inner::before {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #e3e8ed;
  position: absolute;
  left: 34px;
  top: 0;
  z-index: 5;
}

.pse-learning-path-wrap
  .archive-learning-path-item:last-child
  .archive-learning-path-inner::after {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #e1e6f0;
  position: absolute;
  left: 30px;
  bottom: 0;
}
.pse-learning-path-head {
  line-height: 32px;
  position: absolute;
  left: 8px;
  top: 0;
  z-index: 10;
}
.pse-learning-path-icon {
  width: 50px;
  height: 50px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 12px;
  border: 4px solid #fff;
  background-color: #fff;
}
.pse-learning-path-title {
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
  color: #333;
  line-height: 28px;
  font-weight: 500;
}
.pse-learning-path-item .archive-learning-path-section:last-child {
  padding-bottom: 48px;
}
.pse-learning-path-section {
  padding-top: 4px;
  padding-bottom: 20px;
  overflow: hidden;
}
.pse-learning-path-section-title {
  display: block;
  font-size: 16px;
  color: #000;
  line-height: 26px;
  font-weight: 400;
}

.pse-learning-path-title {
  font-size: 16px;
  font-weight:600;
  line-height: 40px;
  margin-top: 8px;
  margin-bottom: 15px;
  color: #3d4a59;
  padding: 3px 38px 3px 15px;
  background: #f5faff;
  width:800px;
  border-radius:8px;
  /* margin-left: -2rem; */
}

.pse-learning-path-item .no-space {
  margin-left: 0;
}
/*Fight with default style*/
.wh_hide_highlight{
  display:none !important;
}

/* topic toc style */
.wh_topic_toc {
  border-left: none !important;
  margin-left: 0;
  padding-left: 0;
  position: sticky;
  top: 100px;
  max-height: 500px;
  overflow-y: auto;
}

.wh_topic_toc ul {
  margin-left: 17px !important;
}


.wh_topic_toc ul .section-item {
  position: relative;
}

.wh_topic_toc ul .section-item::before {
  content: " ";
  position: absolute;
  top: 16px;
  left: -14px;
  width: 1px;
  height: 100%;
  background: rgba(16, 31, 58, .1);
}


.wh_topic_toc ul .section-item:last-child::before {
  display: none;
}

.wh_topic_toc ul .section-title {
  position: relative;
}

.wh_topic_toc ul .section-title::before {
  content: " ";
  position: absolute;
  top: 7px;
  left: -17px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  border: 1px solid #D6DCDF;
  background: #FFFFFF;
}


.wh_topic_toc ul .section-title:has(a.current_node)::before {
  background: #006EE1;
  border: none;
}


.wh_topic_toc a:hover {
  text-decoration: underline;
}

.wh_topic_toc a.current_node {
  text-decoration: none;
  color: #006EE1 !important;
}
/*back to top*/
/* ====== 回到顶部按钮美化 ====== */
#go2top {
    /* 保持原有布局属性不变 */
    display: none;
    position: fixed;
    z-index: 999;
    height: 44px;
    width: 44px;
    bottom: 37px;
    right: 25px;
    cursor: pointer;
    
    /* 重置原有样式 */
    border: none !important;
    background-color: transparent !important;
    padding: 0 !important;
    text-align: center;
    border-radius: 50%; /* 可选：改为圆形 */
    
    /* 隐藏原有图标（必需） */
    span.oxy-icon-up {
        display: none !important;
        visibility: hidden !important;
    }
}

/* 伪元素 - 背景层（可做渐变/纯色背景） */
#go2top::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #444; /* 背景色，可修改 */
    border-radius: inherit; /* 继承按钮圆角 */
    z-index: -1; /* 确保在图标下方 */
}

/* 伪元素 - 图标层（核心替换部分） */
#go2top::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* 精准居中 */
    width: 24px; /* 图标宽度 */
    height: 24px; /* 图标高度 */
    
    /* === 替换为您的图片 === */
    background-image: url('https://cdn.jsdelivr.net/npm/ionicons@5.5.3/dist/svg/arrow-up.svg');
    
    background-size: contain; /* 完整包含 */
    background-position: center;
    background-repeat: no-repeat;
    filter: brightness(0) invert(1); /* 使图标变为白色，可删除 */
}

/* 悬停效果 */
#go2top:hover::before {
    background: #666; /* 悬停时背景色 */
    transform: scale(1.05); /* 轻微放大 */
    transition: all 0.2s ease;
}

/* 点击效果 */
#go2top:active::before {
    transform: scale(0.95);
}

/*引用新字体*/
@font-face {
  font-family: "manrope";
  src: url(./fonts/Manrope-VariableFont_wght.ttf);
  font-display: swap;
}
/* 更改notes图标 */
div.note_restriction {
  background-image: url(../images/notes/restriction.svg) !important;
  background-repeat: no-repeat;
  background-size: 23px 29px;
}
div.note_note {
  background-image: url(../images/notes/note.svg) !important;
  background-repeat: no-repeat;
  background-size:28px 28px;
}
div.note_tip {
  background-image: url(../images/notes/tip.svg) !important;
  background-repeat: no-repeat;
  background-size:28px 28px;
}
div.note_caution {
  background-image: url(../images/notes/caution.svg) !important;
  background-repeat: no-repeat;
}
div.note_danger {
  background-image: url(../images/notes/danger.svg) !important;
  background-repeat: no-repeat;
}
div.note_remember {
  background-image: url(../images/notes/remember.svg) !important;
  background-repeat: no-repeat;
}
div.note_troubleshooting {
  background-image: url(../images/notes/troubleshooting.svg) !important;
  background-repeat: no-repeat;
  background-size:28px 28px;
}
div.note_warning {
  background-image: url(../images/notes/warning.svg) !important;
  background-repeat: no-repeat;
}
div.note_important {
  background-image: url(../images/notes/important.svg) !important;
  background-repeat: no-repeat;
  background-size:28px 28px;
}



/* 搜索框 */
.search_input {
  background: none;
  padding: 0;
  display: inline-block;
  vertical-align: middle;
  float: right;
  margin: 0;
  position: absolute;
  border: 0;
  margin-top: 30px;
}
#searchForm {
  width: 61.25vw;
  margin: 0 auto;
}
#searchForm > div {
  position: relative;
  margin: initial;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
}
input[type="search"] {
  background: #fff url(https://help.yeastar.com/resources/images/search.svg)
    no-repeat 6px;
  border-radius: 3px;
  padding: 10px 8px 10px 32px;
  border: 1px solid #0098d9;
}
input[type="search"]:focus {
  box-shadow: 0 0 8px rgba(0, 113, 194, 24%);
}
.wh_search_button {
  display: none;
}
.back-home {
  position: absolute;
  top: 0;
  left: -140px;
  color: #fff;
}
.back-home a {
  color: #fff;
}
.back-home img {
  width: 38px;
}
/* about this guide */
.guide-chapters {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: stretch;
  align-content: stretch;
  flex-wrap: wrap;
}
.chapter {
  font-weight: 400;
  position: relative;
  margin: 1.6em 1.6em 1.6em 0;
  padding-left: 2em;
  position: relative;
  background-color: #fff !important;
}
.chapter_image {
  width: 60px;
  height: 60px;
  /* position:absolute;
*/
  margin-left: 20px;
  margin-bottom: 20px;
  -webkit-border-radius: 50%;
  box-shadow: 0 1.6px 3.6px 0 hsla(0, 0%, 0%, 0.132),
    0 0.3px 0.9px 0 hsla(0, 0%, 0%, 0.108);
  border: 1px solid hsla(0, 0%, 100%, 0);
}

.chapter_image_install {
  height: 80px;
  /* position:absolute;
*/
  margin-bottom: 10px;
}
.chapter_text {
  position: relative;
  width: 100%;
}
.chapter_title {
  font-size: 1.1em;
  margin-left: -1.8em;
  text-align: center;
}
.chapter_title a {
  color: #3d4a59 !important;
}
.chapter_title a:hover {
  color: #0081cc !important;
}
.chapter_title span {
  display: block;
  width: 100%;
}
div[data-id="getting-started"] > div > .chapter_image {
  background: url("../images/p-series-title-images/getting-started.png")
    no-repeat center;
  background-size: 60%;
}
div[data-id="dashboard"] > div > .chapter_image {
  background: url("../images/p-series-title-images/dashboard.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="extension"] > div > .chapter_image {
  background: url("../images/p-series-title-images/extension.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="extension-group"] > div > .chapter_image {
  background: url("../images/p-series-title-images/extension-group.png")
    no-repeat center;
  background-size: 70%;
}
div[data-id="role"] > div > .chapter_image {
  background: url("../images/p-series-title-images/role.png") no-repeat center;
  background-size: 60%;
}
div[data-id="linkus-server"] > div > .chapter_image {
  background: url("../images/p-series-title-images/linkus-server.png") no-repeat
    center;
  background-size: 65%;
}
div[data-id="trunk"] > div > .chapter_image {
  background: url("../images/p-series-title-images/trunk.png") no-repeat center;
  background-size: 55%;
}
div[data-id="call-control"] > div > .chapter_image {
  background: url("../images/p-series-title-images/call-control.png") no-repeat
    center;
  background-size: 55%;
}
div[data-id="system"] > div > .chapter_image {
  background: url("../images/p-series-title-images/system.png") no-repeat center;
  background-size: 70%;
}
div[data-id="maintenance"] > div > .chapter_image {
  background: url("../images/p-series-title-images/maintenance.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="reports"] > div > .chapter_image {
  background: url("../images/p-series-title-images/reports.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="security"] > div > .chapter_image {
  background: url("../images/p-series-title-images/security.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="call-features"] > div > .chapter_image {
  background: url("../images/p-series-title-images/call-features.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="call-center"] > div > .chapter_image {
  background: url("../images/p-series-title-images/call-center.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="operator-panel"] > div > .chapter_image {
  background: url("../images/p-series-title-images/operator-panel.png")
    no-repeat center;
  background-size: 60%;
}
div[data-id="auto-provisioning"] > div > .chapter_image {
  background: url("../images/p-series-title-images/auto-provisioning.png")
    no-repeat center;
  background-size: 60%;
}
div[data-id="contacts"] > div > .chapter_image {
  background: url("../images/p-series-title-images/contacts.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="integration"] > div > .chapter_image {
  background: url("../images/p-series-title-images/integration.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="references"] > div > .chapter_image {
  background: url("../images/p-series-title-images/references.png") no-repeat
    center;
  background-size: 60%;
}
div[data-id="install-dell"] > div > .chapter_image_install {
  background: url("../images/p-series-title-images/dell.png") no-repeat center;
  background-size: 35%;
}
div[data-id="install-aws"] > div > .chapter_image_install {
  background: url("../images/p-series-title-images/aws.png") no-repeat center;
  background-size: 60%;
}
div[data-id="install-hyper-v"] > div > .chapter_image_install {
  background: url("../images/p-series-title-images/Microsoft-Hyper-v.png")
    no-repeat center;
  background-size: 60%;
}
div[data-id="install-vmware"] > div > .chapter_image_install {
  background: url("../images/p-series-title-images/vmware.png") no-repeat center;
  background-size: 40%;
}

/* 反馈模块 */
.feedback div {
  position: relative;
  margin-bottom: 1px;
}

.feedback .email-box{
	width: 500px;
}
.feedback div span.email-name,
.feedback div span.message {
  margin-left: 0;
}
.feedback div span.message {
  display: block;
  margin-bottom: 5px;
}
.feedback input[type="radio"],
.feedback input[type="checkbox"] {
  width: 20px;
  height: 20px;
  opacity: 0;
  position: relative;
  top: 8px;
  left: 0;
  margin-top: 0;
}
.feedback::-webkit-input-placeholder {
  color: #d0d0d0;
}
.feedback::-moz-placeholder {
  color: #d0d0d0;
}
.feedback:-ms-input-placeholder {
  color: #d0d0d0;
}
:-input-placeholder {
  color: #d0d0d0;
}
.feedback label {
  width: 20px;
  height: 20px;
  border: 1px solid #ccc;
  position: absolute;
  left: 0;
  top: 8px;
  z-index: -1;
}
.help-radio label {
  border-radius: 50%;
}
.feedback input:checked + label {
  border: 1px solid #0081cc;
  background: #0081cc;
}
.feedback input:checked + label:after {
  position: absolute;
  content: "";
  width: 6px;
  height: 10px;
  top: 2px;
  left: 6px;
  border: 2px solid #fff;
  border-top: none;
  border-left: none;
  transform: rotate(45deg);
}
.help-radio div {
  display: inline-block;
  vertical-align: top;
  width: 130px;
  border-radius: 20px;
  padding: 8px 0;
  margin: 10px 30px 0 0;
  cursor: pointer;
  background: #f6f7f9;
}
.help-radio div:last-child {
  margin-right: 0;
}
.feedback div span {
  margin-left: 15px;
  position: relative;
  top: 3px;
}
.feedback div.have-help span {
  margin-left: 32px;
  position: relative;
  padding-left: 35px;
  top: 0;
  font-weight: 500;
  font-size: 16px;
}
.help-radio div span:before {
  content: "";
  display: inline-block;
  background: url(../images/good-img.svg) center no-repeat;
  background-size: cover;
  width: 25px;
  height: 25px;
  position: absolute;
  top: -3px;
  left: 0;
}
.help-radio div:hover span {
  color: #006ee1;
}
.help-radio div:hover span:before,
.help-radio .select-active span:before {
  background-image: url(../images/good-img-active.png);
}
.help-radio div:last-child span:before {
  transform: rotateX(180deg);
}
.help-radio div:hover span,
.help-radio .select-active span {
  color: #fff;
}
.help-radio {
  padding-bottom: 20px;
}
.help-checkbox {
  padding-top: 20px;
  min-height: 545px;
  border-top: 1px solid #e9e9eb;
  display: none;
}
.text-email {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px solid #e9e9eb;
}
.text-email input {
  margin-top: 0;
  width: 92%;
  margin-left: 10px;
  border: none;
  border: 1px solid #ccc;
  padding-left: 10px;
}
.text-area {
  margin-top: 15px;
}
.text-area textarea {
  width: 100%;
  height: 100px;
  border: none;
  border: 1px solid #ccc;
  padding-left: 10px;
}
.text-area textarea:focus,
.text-email input:focus {
  outline: none;
  border: 1px solid #0070c0;
}
.feedback {
  border-top: 1px solid #e9e9eb;
  position: relative;
  width: 100%;
  padding: 20px;
}
.feedback h4 {
  font-size: 18px;
}
.submit-feedback {
  position: absolute;
  bottom: 25px;
  right: 20px;
  width: 120px;
  padding: 6px 0 7px;
  background-color: #0070c0;
  color: #fff;
  border: 1px solid #0070c0;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  display: none;
}
.submit-feedback:hover {
  background: #0098d9;
  border-color: #0098d9;
}
.submit-feedback:focus {
  outline: none;
}
.submit-feedback-disabled {
  background-color: #f5f5f6;
  border-color: transparent;
  color: #9b9ea0;
  cursor: no-drop;
}
.submit-success {
  position: absolute;
  right: 20px;
  color: green;
  font-weight: 600;
  display: none;
}
/* 反馈模块 */
.feedback-en {
  border-top: 1px solid #dee2e6;
  padding-top: 40px;
}
.feedback-en h4 {
  font-size: 18px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 25px;
}
.button-wrap p {
  display: inline-block;
  vertical-align: top;
  border: 2px solid #006ee1;
  width: 140px;
  border-radius: 20px;
  /* padding: 10px 0 6px; */
  margin: 0 30px 0 0;
  cursor: pointer;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  position: relative;
  line-height: 40px;
}
.feedback-en .button-wrap p:last-child {
  margin-right: 0;
}
.feedback-en .button-wrap p:hover,
.feedback-en .button-wrap .select-active {
  background-color: #006ee1;
  color: #fff;
}
.feedback-en .button-wrap p span {
  position: relative;
  display: flex;
  align-items: center;
  width: max-content;
  margin: 0 auto;  
  font-weight: 600;
}
.feedback-en .button-wrap p span::before {
  content: "";
  display: inline-block;
  background: url(../images/good-img.svg) center no-repeat;
  background-size: cover;
  width: 30px;
  height: 30px;
  margin: -8px 6px 0 0;
}
.help-radio div:hover span {
  color: #006ee1;
}
.feedback-en .button-wrap p:hover span::before,
.feedback-en .button-wrap .select-active span:before {
  background-image: url(../images/good-img-active.png);
}
.feedback-en .button-wrap p:last-child span::before {
  transform: rotateX(180deg);
  margin-top: 0;
  position: relative;
  top: 3px;
}
.feedback-en .button-wrap {
  width: max-content;
  margin: 0 auto 25px;
}
.feedback-en .feedback-tip span {
  font-size: 16px;
  text-align: center;
  display: block;
  color: #303c42;
  display: none;
}
.feedback-en .feedback-tip span a {
  color: #006ee1;
}
/* list 样式 */
li {
  margin-top: 0.3em;
}
li p {
  margin-top: 0.2em !important;
}
caption {
  padding-top: 8px;
  padding-bottom: 8px;
  color: #777;
  text-align: left;
  display: none !important;
}
/*Version selector*/
.desktop-nav__product-switcher {
  display: inline-block;
  padding-left: 24px;
}
.product-switcher--desktop .product-switcher__menu {
  -webkit-transition: -webkit-box-shadow 83ms;
  transition: -webkit-box-shadow 83ms;
  transition: box-shadow 83ms;
  transition: box-shadow 83ms, -webkit-box-shadow 83ms;
  border: 0;
  padding-bottom: 12px;
  top: 36px;
  width: 9.2rem;
}
.product-switcher__wrapper .product-switcher__menu {
  padding-bottom: revert;
}
.dropdown__menu[aria-hidden="false"] {
  display: none;
}
.dropdown__menu {
  position: absolute;
  border-radius: 2px;
  overflow: hidden;
  z-index: 200;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.15);
  box-shadow: 1px 2px 10px rgba(0, 0, 0, 0.15);
  display: none;
  overflow: visible;
  top: 52px;
}
#product-switcher__button {
  background: #fff;
  border: none;
}
#product-switcher__button:focus {
  outline-color: rgba(153, 153, 153, 0);
}
li-icon.product-switcher-button__caret:focus {
  outline-color: #fff;
}
#product-switcher__button:hover {
  background: #0099d742;
  border-radius: 12px;
}
.product-switcher-button__caret svg {
  position: relative;
  top: 5px;
  left: 5px;
  transition: all 0.3s;
}
.product-switcher-button__caret.active {
  transform: rotate(180deg);
}
.li-icon[type$="-icon"] {
  width: 24px;
  height: 24px;
}
.product-switcher__wrapper .product-menu__link--selected {
  color: #0073b1;
}
.product-switcher__wrapper .product-menu__link {
  font-size: 1.5rem;
  line-height: 1.42857;
  color: rgba(0, 0, 0);
  font-style: normal;
  width: 100%;
  padding-left: 1.5rem;
}
/*PDF Download*/
.download-pdf {
  -webkit-tap-highlight-color: transparent;
  color: #3d4a59;
  line-height: 1.5;
  font-family: Roboto-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma, Arial,
    sans-serif;
  -webkit-font-smoothing: antialiased !important;
  list-style: none;
  box-sizing: border-box;
  display: inline-block;
  background: url(../images/pdf-download.png) no-repeat;
  background-size: 18px;
  background-position-x: -2px;
  padding-left: 25px;
}
.download-pdf a:hover {
  color: #3167b3;
  text-decoration: underline;
}

/*表格样式*/
.tablecap {
  font-size: 14px;
  font-weight: bold;
}
table.table {
  border: 1px solid #dddddd;
}

.table thead th {
  text-align:center;
  vertical-align: middle;
}

.simpletable td:not([valign]),
.table td:not([valign]) {
	vertical-align: middle;
}

#hot-standby__advanced-settings {
  background-color: #efefef;
}
/*自定义 section title 样式*/
.sectiontitle {
  border-top: 1px solid #eee;
  font-weight: 600;
  font-size: 20px;
  line-height: 36px;
  margin-top: 36px;
  margin-bottom: 16px;
  color: #101f3a;
  padding-left: 10px !important;
  padding: 1em 0 0;
}

.permalink {
  display: none;
}

/* .wh_expand_btn {
  display: none;
} */

h2.tasklabel {
  border-bottom: 1px solid #eee;
  font-weight: 700;
  font-size: 18px;
  line-height: 36px;
  margin-bottom: 15px;
}
/*自定义example 样式*/
.example {
  border-top: 1.5px solid #425cfb;
  padding-top: 10px;
  margin-top: 20px;
}
/* 变量字体 */
var.varname {
  font-style: normal;
  color: #ff4975;
}
/* section title 行高*/
.h2 {
  line-height: 3;
}
/* 强调字体 */
.emphasize {
  font-weight: bold;
  color: red;
}
.importanttitle {
  font-weight: bold;
  color: red;
}
/*Feedback form*/
.feedback-form {
  max-width: 780px;
  margin: 0 0 3rem;
  font-size: 12px;
  position: relative;
  margin-top: -2rem;
  border-top: 1px solid #ccc;
  padding-top: 35px;
}
.show-feedback-form {
  display: none;
  margin-top: 25px;
}
.feedback-form h2 {
  height: 58px;
  line-height: 58px;
  color: #3d4a59;
  padding: 0 20px;
  background: #f4f4f4;
  margin: 0;
  font-size: 12px;
}
.fb-like.fb_iframe_widget {
  display: none;
}
.form_cont .row_dsr p,
.form_cont .row_dsr div {
  float: left;
}
.form_cont .dsr_title {
  width: 130px;
  padding-right: 25px;
  text-align: right;
}
.form_cont .row_dsr .dsr_star {
  padding: 0 8px;
}
.form_cont .row_dsr span {
  float: left;
  display: block;
  width: 17px;
  height: 20px;
  margin-right: 3px;
  cursor: pointer;
  background: url(./Images/icon_star.png) no-repeat 0 50%;
}
.form_cont .choose_answer {
  float: left;
  border-right: 1px solid #ccc;
  margin-right: 21px;
  height: 50px;
  padding: 12px 10px 0 0;
}
.questions {
  padding-top: 2px;
}
.form_cont .choose_answer dt,
.form_cont .choose_answer dd {
  float: left;
}
.form_cont .choose_answer dt {
  font-weight: 300;
  font-size: 22px;
  color: #5f5a5a;
}
.questions > div {
  font-size: 22px;
  color: #5f5a5a;
}
.questions a {
  font-size: 16px;
}
.form_cont .choose_answer dd {
  padding-right: 13px;
  padding-top: 6px;
}
.form_cont .choose_answer dd a {
  display: block;
  padding-left: 25px;
  height: 20px;
  background: url(./Images/icon.png) no-repeat 0 -450px;
  text-decoration: none;
}
.clearfix {
  zoom: 1;
}
.clearfix dt {
  font-weight: normal;
}
.form_cont .row_dsr {
  float: left;
}
.form_cont .row {
  clear: both;
  overflow: hidden;
  padding-top: 15px;
}
.form_cont .row .tit {
  height: 39px;
  line-height: 39px;
  width: 138px;
  text-align: left;
  padding: 0 25px 0 16px;
}
.form_cont .row .tit,
.form_cont .row .enter_text {
  float: left;
}
.form_cont .row textarea {
  width: 621px;
  height: 132px;
  padding: 5px 10px;
  font-size: 14px;
  color: #666;
  line-height: 24px;
  border: 1px solid #e5e5e5;
  overflow: auto;
  resize: none;
  -webkit-transition: all 0.4s;
  outline: none;
}
.form_cont .row .text {
  width: 621px;
  height: 37px;
  font-size: 14px;
  color: #666;
  line-height: 37px;
  padding: 0 10px;
  background: none;
  border: 1px solid #e5e5e5;
  -webkit-transition: all 0.4s;
  margin-top: 0;
}
.form_cont .upload {
  padding: 20px 0 0 118px;
}
.form_cont .upload .btn_upload {
  float: left;
  position: relative;
  height: 25px;
}
.form_cont .upload .btn_upload a {
  display: block;
  height: 25px;
  padding-left: 35px;
  line-height: 25px;
  background: url(./Images/icon.png) no-repeat 0 -300px;
}
.form_cont .upload .upload_file {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
  margin-top: 0;
}
.form_cont .upload .tips {
  padding-left: 5px;
  line-height: 25px;
}
.form_cont .upload_list {
  display: none;
  padding-top: 10px;
  padding-left: 0;
}
.form_cont .upload_list li {
  height: 24px;
  line-height: 24px;
  overflow: hidden;
}
.form_cont .upload_list li a,
.form_cont .upload_list li span {
  float: left;
  display: block;
}
.form_cont .upload_list li a {
  margin-left: 5px;
  width: 24px;
  height: 24px;
  overflow: hidden;
  background: url(./Images/btn_delete.png) no-repeat 0 0;
}
.form_cont .submit {
  padding: 10px 0 0 0;
}
.form_cont .submit .btn {
  display: block;
  width: 110px;
  height: 35px;
  line-height: 35px;
  color: #3d4a59;
  text-align: center;
  background: #f3f3f3;
  border: 1px solid #d9d9d9;
  cursor: pointer;
  -webkit-transition: all 0.4s;
  outline: none;
  padding: 0;
  margin-left: 8.8em;
}
.form_cont .submit .btn:hover {
  color: #fff;
  background: #004277;
  border-color: #004277;
}
.form_cont .row_dsr span.select {
  background-position: 100% 50%;
}
.form_cont .choose_answer dd.cur a {
  background-position: 0 -500px;
}
.form_cont .row textarea:focus,
.form_cont .row .text:focus {
  border: 1px solid #999;
  outline: none;
}
.btn-disabled {
  pointer-events: none;
}
.form_cont .row .red {
  border-color: red;
}
.form_cont .upload_list li a:hover {
  background-position: 0 100%;
}
/*.tip {
  background-color: #5185cb;
  color: #000;
  font-size: 1.4rem;
}*/
/*Download PDF button */
.download_pdf {
  background: transparent;
  background-color: transparent;
  font-size: 14px;
  color: #188bf0;
  margin: -4em 0 2em 0;
  padding: 6px 25px;
  -webkit-transition: background-color 0.2s;
  -moz-transition: background-color 0.2s;
  -o-transition: background-color 0.2s;
  float: right;
}
/*自定义wh_titles 风格 */
.wh_tile {
  font-weight: 300;
  position: relative;
  margin: 1.6em;
  padding: 2.8em;
  position: relative;
  background-color: #fff !important;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 20px;
  -moz-transition: box-shadow 0.3s ease;
  -o-transition: box-shadow 0.3s ease;
  -webkit-transition: box-shadow 0.3s ease;
  transition: box-shadow 0.3s ease;
  box-shadow: 0 1.6px 3.6px 0 hsla(0, 0%, 0%, 0.132),
    0 0.3px 0.9px 0 hsla(0, 0%, 0%, 0.108);
  border: 1px solid hsla(0, 0%, 100%, 0);
}
.wh_tile:hover {
  box-shadow: 0px 2px 10px #5e5e5e;
}
.wh_tile_text {
  position: relative;
  height: 100%;
  overflow: hidden;
  left: 20%;
  text-align: left;
  width: 80%;
}
/* 设置 wh_title 的背景图片 *******************************/
.wh_tile_image {
  width: 50px;
  height: 50px;
  position: absolute;
}
div[data-id="administrator"] > div > .wh_tile_image {
  background: url("../images/p-series-title-images/administrator.png") no-repeat
    center;
  background-size: 50px;
}
div[data-id="web-client"] > div > .wh_tile_image {
  background: url("../images/p-series-title-images/web-client.png") no-repeat
    center;
  background-size: 50px;
}
div[data-id="installation"] > div > .wh_tile_image {
  background: url("../images/p-series-title-images/installation.png") no-repeat
    center;
  background-size: 50px;
}
div[data-id="call-center-console"] > div > .wh_tile_image {
  background: url("../images/p-series-title-images/call-center.png") no-repeat
    center;
  background-size: 50px;
}
div[data-id="operator-panel"] > div > .wh_tile_image {
  background: url("../images/p-series-title-images/operator-panel.png")
    no-repeat center;
  background-size: 50px;
}
/*middle-nav*/
.mid-nav {
  margin: 0;
  padding: 0;
}
.li-click {
  background: #1c90f6;
  color: #fff !important;
}
.mid-nav a {
  color: #666;
  text-decoration: none;
  width: 24.89%;
  float: left;
  text-align: center;
  padding: 17px 0;
  border-bottom: 2px solid #1c90f6;
  border-left: 1px solid #fff;
  cursor: pointer;
  display: block;
}
.mid-nav a:hover {
  background: #1c90f6;
  color: #fff;
}
.contetn-intro {
  text-align: left;
  min-height: 500px;
}
/*
* ==============================================
* Skin for oXygen generated WebHelp.
* ==============================================
*/

/*删除 child links下面的short description*/
.wh_child_links > nav li div {
  display: none;
}
.wh_main_page .container-fluid {
  max-width: 100%;
  padding-right: 0 !important;
  padding-left:0 !important;
}
/*.container-fluid {
  padding: 0 1.2vw;
}
.wh_main_page .container-fluid {
  padding: 3rem;
} */

/* topic archive */
.archive-learning-path-item {
  position: relative;
  box-sizing: border-box;
}
.archive-learning-path-inner {
  padding-left: 70px;
  position: relative;
}
.archive-learning-path-inner::before {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #e3e8ed;
  position: absolute;
  left: 18px;
  top: 0;
  z-index: 5;
}

.archive-learning-path-wrap
  .archive-learning-path-item:last-child
  .archive-learning-path-inner::after {
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #e1e6f0;
  position: absolute;
  left: 30px;
  bottom: 0;
}
.archive-learning-path-head {
  line-height: 32px;
  position: absolute;
  left: -10px;
  top: 0;
  z-index: 10;
}
.archive-learning-path-icon {
  width: 50px;
  height: 50px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 12px;
  border: 4px solid #fff;
  background-color: #fff;
}
.archive-learning-path-title {
  display: inline-block;
  vertical-align: middle;
  font-size: 18px;
  color: #333;
  line-height: 28px;
  font-weight: 500;
}
.archive-learning-path-item .archive-learning-path-section:last-child {
  padding-bottom: 48px;
}
.archive-learning-path-section {
  padding-top: 4px;
  padding-bottom: 20px;
  overflow: hidden;
}
.archive-learning-path-section-title {
  display: block;
  font-size: 16px;
  color: #000;
  line-height: 26px;
  font-weight: 400;
}

.learning-path-title {
  font-size: 18px;
  line-height: 51px;
  margin-top: 20px;
  margin-bottom: 5px;
  color: #3d4a59;
  /* margin-left: -2rem; */
}

.archive-learning-path-item .no-space {
  margin-left: 0;
}


/* Yeastar  Copyright*/
@media (max-width: 1500px) and (min-width: 769px) {
  .chapter {
    margin: 0.9em;
    left: 1%;
    width: 21.5%;
  }
  div.ycm_api_card_zh {
    width: 320px;
    margin-left:40px;
  }

  div.ycm_api_card {
    width: 314px;
  }
  div.card_right_zh {
    width: 228px;
    margin-left: 0px;
  }
}
@media (max-width: 1300px) {
  div#footer-widgets .footer-box {
      width: 45%;
  }
}
@media (max-width: 1152px) {
  .content-area {
    padding: 20px 0;
  }
  .footer-left {
    float: initial;
    margin-bottom: 12px;
  }
  .footer-right {
    float: initial;
  }
}
@media (max-width: 767px) {
  .right-content .feedback-content {
    margin-left: 0;
    margin: 0 4px;
  }
  .right-content {
    text-align: left;
  }
} /*
* ------------------------------------------------------------------
*  
* Fonts.
*  
*/
@import url("https://fonts.googleapis.com/css?family=Roboto:400,700,300");
html,
body {
  min-width: 100%;
}
body {
  font-family: "Roboto", sans-serif;
  color: #3d4a59;
  font-size: 16px !important;
}
/*
   * ------------------------------------------------------------------
   *
   * Fight with bootstrap
   */

.navbar-brand {
  height: auto;
}
.navbar {
  border: none;
  border-radius: 0;
  margin: 0;
}
.wh_header {
  background: #000 none;
  color: #ffffff;
  padding-left: 10px;
  padding-right: 10px;
  position: absolute;
  width: 100%;
  padding-top: 15px;
  padding-bottom: 14px;
  display: none;
}
a,
a:hover,
a:visited {
  color: #0081cc;
}
a:hover {
  text-decoration: none;
}
/*
* ------------------------------------------------------------------
*  
* Publication titles
*  
*/
.wh_publication_title > a {
  color: #fff;
}
/*
* ------------------------------------------------------------------
*  
* Menu
*  
*/
.wh_top_menu {
  text-transform: uppercase;
  margin: 0.4em 0;
  font-size: 0.9em;
}
.wh_top_menu a {
  color: #fff;
  line-height: 2em;
}
/* The submenus */
.wh_top_menu ul ul {
  background-color: #3d4a59;
}
.wh_top_menu ul li:hover {
  background-color: #3d4a59;
}
.wh_top_menu ul ul li a:hover {
  background: #000;
}
.wh_top_menu ul ul li {
  border-top-color: #000;
  width: 270px;
  text-transform: capitalize;
}
.wh_top_menu ul ul li.has-children:after {
} /*
* ------------------------------------------------------------------
*  
* Link to the index.
* 
*/
.wh_indexterms_link a span {
  display: none;
}
.wh_indexterms_link a:before {
  color: #fff;
}
/*
* ------------------------------------------------------------------
*  
* Breadcrumb
*  
*/
.wh_breadcrumb ol {
  color: #878787;
}
.wh_breadcrumb ol a {
  color: inherit;
}
.wh_breadcrumb ol .active {
  color: #5185cb;
}
/*
* ------------------------------------------------------------------
*  
* Tools and navigation
* 
*/
.wh_tools {
  background-color: #F4F9FC;
  margin: 0em 0 2em;
}
.wh_navigation_links,
.wh_navigation_links .navnext,
.wh_navigation_links .navprev {
}
.webhelp_expand_collapse_sections,
.wh_hide_highlight,
.wh_navigation_links a,
.wh_navigation_links a:hover,
.wh_navigation_links a:active,
.wh_navigation_links a:visited,
.wh_navigation_links a:before,
.wh_navigation_links a:hover:before,
.wh_navigation_links a:active:before,
.wh_navigation_links a:visited:before {
  color: #347bb7;
  text-decoration: none;
}

/*相关链接样式覆盖*/
div .wh_related_links .related-links, .wh_topic_content .related-links{
  background-color:#f8f8f8;
}

/*
* ------------------------------------------------------------------
*  
* Tiles
* 

You can style some of the tiles in a special way. 
Example:.wh_tiles *[data-id='getting_started'] {
background-color:gray;
}
*/

/*
* ------------------------------------------------------------------
*  
* Search area
* 
*/

/*.wh_search_input {
  padding: 4em 0 4em 0;
  margin: 0;
  align-items: center;
  color: #0b6a9c;
  text-align: center;
  background-color: #0b6a9c;
  background-image: linear-gradient(#0b6a9c, transparent), url("../images/Clouds.png") !important;
  background-position: center bottom;
*/  background-size: cover;
}

.wh_welcome:not(:empty) {
  font-size: 2.9em;
  margin: 0 auto;
  font-family: Roboto, sans-serif;
  padding: 0 0 0.5em 0;
  text-shadow: none;
  font-weight: 300;
  line-height: 1.2em;
}

.wh_search_textfield {
  border: solid 1px #ccc;
  border-radius: 5px;
  padding: 0 0.5em;
  position: relative;
  height: 2.8em;
}
.wh_search_button {
  border: solid 1px #ccc;
  border-radius: 0 5px 5px 0;
  padding: 0 0.5em;
  color: #fff;
  background-color: #c93416;
  height: 2.8em;
}
/* Search autocomplete icons */
.search-autocomplete-proposal-type-history a,
.search-autocomplete-proposal-type-history a:hover,
.search-autocomplete-proposal-type-history a:visited,
.search-autocomplete-proposal-type-history a:active {
  text-decoration: none;
  color: inherit;
  font-size: 0.8em;
}
.ui-state-active .search-autocomplete-proposal-type-history a,
.ui-state-active .search-autocomplete-proposal-type-history a:hover,
.ui-state-active .search-autocomplete-proposal-type-history a:visited,
.ui-state-active .search-autocomplete-proposal-type-history a:active {
  color: #fff;
}
/* Active search page */
#wh-search-pagination > ul > li.active > a {
  background-color: #346ec5;
}
@media only screen and (max-width: 768px) {
  .footer_nav_item:first-child {
    display: block;
    padding: 0;
    border: none;
  }
  .footer_nav_item {
    display: block;
  }
} /*
* ------------------------------------------------------------------
*  
* Publication TOC
* 
*/

.wh_publication_toc {
  border-radius: 3px;
  padding: 1.5em 0.5em;
  background-color: #fff;
  border-right: 2px solid #f8f8f8;
}
.wh_publication_toc .active > .topicref a {
  color: #5185cb;
}
.wh_publication_toc span,
.wh_publication_toc a,
.wh_publication_toc a:visited,
.wh_publication_toc a:hover {
  color: #878787;
}
.wh_publication_toc a:hover {
  text-decoration: underline;
}
.wh_publication_toc ul li,
#wh_topic_toc ul li {
  margin-top: 0.7em;
}
@media only screen and (max-width: 767px) {
  .wh_publication_toc {
    border-radius: 0;
    padding: 1em 0.5em;
    margin-top: 10px;
    border: 1px solid #e0e0e0;
  }
  .wh_related_links,
  .wh_child_links,
  .wh_topic_content .related-links {
    border: 1px solid #e0e0e0;
  }
} /* Publication TOC tooltip */
.wh_breadcrumb .topicref .wh-tooltip,
.wh_publication_toc .topicref .wh-tooltip {
  background-color: #5185cb;
  color: #fff;
  font-size: 1.4rem;
}
.wh_breadcrumb .topicref .wh-tooltip a,
.wh_publication_toc .topicref .wh-tooltip a {
  color: #fff;
  text-decoration: underline;
}
/* Tooltip arrow. */

[data-tooltip-position="left"] .topicref .wh-tooltip::before {
  border-left-color: #5185cb;
}
[data-tooltip-position="right"] .topicref .wh-tooltip::before {
  border-right-color: #5185cb;
}
[data-tooltip-position="bottom"] .topicref .wh-tooltip::before {
  border-bottom-color: #5185cb;
}
[data-tooltip-position="top"] .topicref .wh-tooltip::before {
  border-top-color: #5185cb;
}
code {
    font-size: 87.5%;
    color: #EB5757;
    word-wrap: break-word;
    padding: 4px;
    border-radius: 4px;
}
/*
 * ------------------------------------------------------------------
 *
 * Footer
 * 
 */
 @font-face {
  font-family: "iconfont";
  src: url(./fonts/iconfont.eot?t=1477445860699);
  src: url(./fonts/iconfont.eot?t=1477445860699#iefix)
      format("embedded-opentype"),
    url(./fonts/iconfont.woff?t=1477445860699) format("woff"),
    url(./fonts/iconfont.ttf?t=1477445860699) format("truetype");
}
@font-face {
  font-family: "FontAwesome";
  src: url(./fonts/fontawesome-webfont.eot?v=4.5.0);
  src: url(./fonts/fontawesome-webfont.eot?#iefix&v=4.5.0)
      format("embedded-opentype"),
    url(./fonts/fontawesome-webfont.woff2?v=4.5.0) format("woff2"),
    url(./fonts/fontawesome-webfont.woff?v=4.5.0) format("woff"),
    url(./fonts/fontawesome-webfont.ttf?v=4.5.0) format("truetype"),
    url(./fonts/fontawesome-webfont.svg?v=4.5.0#fontawesomeregular)
      format("svg");
  font-weight: normal;
  font-style: normal;
}
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome !important;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome !important;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.fa-lg {
  font-size: 1.33333333em;
  line-height: 0.75em;
  vertical-align: -15%;
}
.fa-2x {
  font-size: 2em;
}
.fa-3x {
  font-size: 3em;
}
.fa-4x {
  font-size: 4em;
}
.fa-5x {
  font-size: 5em;
}
.fa-fw {
  width: 1.28571429em;
  text-align: center;
}
.fa-ul {
  padding-left: 0;
  margin-left: 2.14285714em;
  list-style-type: none;
}
.fa-ul > li {
  position: relative;
}
.fa-li {
  position: absolute;
  left: -2.14285714em;
  width: 2.14285714em;
  top: 0.14285714em;
  text-align: center;
}
.fa-li.fa-lg {
  left: -1.85714286em;
}
.wh_footer {
  text-align: center;
  padding: 0;
  position: relative;
  bottom: 0;
  width: 100%;
  color: black;
  background: none #ffffff;
}
.wh_footer a {
  color: #303c42;
  padding: 0;
}
.footer-container.mx-auto {
  width: 100%;
}
div#footer-widgets .footer-box {
  max-width: initial;
  width: initial;
  padding: 0;
}
.footer-html-cn .site-footer .container {
  padding: 65px 0 0;
  width: 1200px;
  max-width: 90%;
  text-align: left;
}
.footer-html-cn #footer-bottom-inner {
  padding-top: 20px;
  padding-bottom: 20px;
  padding: 20px 0;
  width: 1200px;
  max-width: 90%;
}
.footer-html-cn #copyright {
  color: #303c42;
  width: 100%;
}
.footer-html-cn .followlink .linkblock:nth-child(2):hover i {
  top: -18px;
}
.footer-html-cn .followlink .linkblock:nth-child(2) {
  line-height: 17px !important;
}
.fa-xing:before {
  content: "\f168";
}
.fa-instagram:before {
  content: "\f16d";
}
.footer-html-en div#footer-widgets .footer-box {
  width: 43%;
}
/*  */
/*
* ------------------------------------------------------------------
*  
* Topic content
* 
*/
.wh_topic_content,
.wh_content_area {
  color: #3d4a59;
  line-height: 1.7em;
  margin-bottom: 80px;
}
.wh_main_page .wh_content_area {
  margin: 0;
  /*margin-left: -20px;*/
  /*margin-right:-20px;*/
}
.wh_topic_content .title.topictitle1 {
  font-size: 2em;
  line-height: 1.1em;
}
.topictitle3 {
  font-weight: 400;
}
.wh_related_links,
.wh_child_links,
.wh_topic_content .related-links {
  padding-top: 7px;
  margin-top: 0;
}
.wh_related_links,
.wh_topic_content .related-links {
  padding: 0.5em 1.5em;
}
.wh_child_links {
  padding: 1.5em;
}
.related-links strong {
  font-weight: 600;
  font-size: 16px;
  margin-left: -15px;
}
.related-links a,
.related-links a:visited {
  color: #5185cb;
  padding-bottom: 0.3em;
  display: inline-block;
}
.filepath {
  color: #c7254e !important;
}

/*ycm pbx provisioning 自定义css*/

 .vertical-chapter {
    display: flex;
    justify-content: left;
  }

 .vertical-chapter div{
	 display:inline-block;
	 margin-top:0px;
     margin-bottom:20px;
	 width: inherit;
 }
 
 .vertical-chapter img {
    width: 78px;
    position: relative;
    top: 23px;
}
 
 .vertical-chapter-text {
	margin-top: 7px;
    width: 450px;
    position: relative;
    top: 28px;
    padding-left: 20px;
 }
 
  .vertical-chapter-text a{
	color: #0081cc;
 }
 
  
  .vertical-chapter-text::before {
  content: "";
  width: 2px;
  height: 73%;
  background-color: #e3e8ed;
  position: absolute;
  left: -39px;
  top: 70px;
}

.vertical-chapter-text-2::before {
  
  width: 0px;
}

.vertical-chapter {
    display: flex;
    justify-content: left;
  }


/*end*/

/*
* ------------------------------------------------------------------
*  
* Search results.
* 
*/
.searchresult {
  list-style: none;
}
.searchresult li a {
  color: #346ec5;
}
.searchresult .shortdesclink {
  margin: 0.3em 0.5em 0 0;
}
.wh_search_expression {
  font-weight: bold;
}
/* Search relative path */
.searchresult li .relativePath a {
  color: #006621;
}
/*
* ------------------------------------------------------------------
*  
* Index terms.
* 
*/
.wh_index_terms span.wh_first_letter {
  color: #346ec5;
}
.wh_index_terms #indexList {
  padding: 0;
}
/*
* ------------------------------------------------------------------
*  
* Tree TOC for the main page.
* 
*/
.wh_main_page_toc {
  width: 1200px;
  max-width: 90%;
}
.wh_main_page_toc .expanded,
.wh_main_page_toc .wh_main_page_toc_accordion_header:hover,
.wh_main_page_toc > .wh_main_page_toc_entry:hover,
.wh_main_page_toc_accordion_entries {
  background-color: #f2f8ff;
}
/**
*
* Styles used for RTL pages
*
*/
html[dir="rtl"] .wh_top_menu ul li:hover > ul {
  max-width: 270px;
}
/*下面是Yeastar导航样式*/
/*nav-menu*/
/*nav-menu*/



.document-url {
  display: inline-block;
  vertical-align: middle;
  font-size: 20px;
  margin: 0;
  color: #101F3A;
  font-family: Manrope !important;
  font-weight: 500;
  margin-left: 13px;
  position: relative;
  top: 2px;
}

.doc-url {
  font-size: 14px;
  font-weight: 100;
  margin-left: 10px;
}
.document-url a {
  text-decoration: none;
  color: #000;
  cursor: pointer;
}
.document-url a:hover {
  color: #3f7dea;
}
.document-url .split {
  font-size: 25px;
  font-weight: 300;
  display: none;
}

li.change-lang:before {
  content: "";
  background: url(../images/p-series/select-language-icon.png) center no-repeat;
  background-size: 20px 20px;
  width: 20px;
  height: 20px;
  display: inline-block;
  position: absolute;
  left: 0;
  display: none;
}


/* free trial nav */
.free-trial a {
  display: block;
  width: 183px;
  background-color: #FFA300;
  border-radius: 18px;
  text-align: center;
  line-height: 36px;
  color: #fff;
  font-size: 18px
}




.change-lang select {
  border: none;
  font-size: 18px;
  outline: none;
  color: #303c42;
}
/*Yeastar P-Series PBX System*/
.p-series-page {
  overflow: hidden;
}
#ug-editor-name {
  position: relative;
  line-height: 1.5em !important;
}
#ug-editor-name .p-series-info {
  display: inline-block;
  vertical-align: top;
}
#ug-editor-name h1 {
  color: #fff;
  font-size: 2.5vw;
  line-height: 3.6vw;
  margin-top: 2.08vw;
  position: relative;
  z-index: 2;
  font-family: "manrope";
}
#ug-editor-name h1 span {
  color: #ffde89;
}
.p-series-page .pbx-plus-more {
  width: 31.6vw;
  height: 2.96vw;
  font-size: 1.25vw;
  line-height: 1.87vw;
  font-weight: 300;
  color: #fff;
  margin-top: 2.7vw;
  margin: 2.7vw 0 4vw 0;
  text-align: left;
}
#apply-edite {
  outline: none;
  width: 215px;
  height: 54px;
  border-color: #fff;
  color: #fff;
  font-size: 18px;
  line-height: initial;
  vertical-align: middle;
  padding: 0 0.5vw;
  appearance: none;
  background: url(../images/p-series/select-icon.png) center no-repeat;
  background-size: 16px 10px;
  background-position-x: 9.5vw;
  border-radius: 8px;
}
#apply-edite option {
  background: #ffffff;
  color: #3d4a59;
}
#ug-editor-name .search_input {
  float: initial;
  position: initial;
  width: 21.25vw;
  margin: 0 11px 0 0;
}
#ug-editor-name input[type="search"] {
  height: 52px;
  width: 21.25vw;
  font-size: 18px;
  color: #3d4a59;
}
#ug-editor-name input[type="search"]:-ms-input-placeholder {
  color: #a9a9a9;
}
#ug-editor-name input[type="search"]::-webkit-input-placeholder {
  color: #a9a9a9;
}
#ug-editor-name input[type="search"]::-moz-placeholder {
  color: #a9a9a9;
}
#ug-editor-name input[type="search"]:-moz-placeholder {
  color: #a9a9a9;
}
.images-group {
  width: 31vw;
  margin-left: 4vw;
}
.images-group img {
  width: 31vw;
  height: auto;
}
.circle-img {
  width: 31vw;
  height: 31vw;
  border: 1px solid #f1f9ff;
  border-radius: 50%;
  display: inline-block;
  opacity: 0.3;
  position: absolute;
}
.circle1 {
  left: -16.5vw;
  top: -5vw;
}
.circle2 {
  left: 2.6vw;
  top: -12vw;
}
.circle3 {
  top: 1vw;
  right: -18vw;
}
/*.p-series-page */
.p-series-page h2 {
  font-size: 2.1875vw;
  line-height: 3.229167vw;
  margin-bottom: 1vw;
  text-align: center;
  font-family: "manrope";
}
.p-series-page p {
  font-size: 16px;
  line-height: 24px;
}
.background {
  background-color: #f6fdff;
}
.get-start {
  width: 72vw;
  min-height: 23vw;
  background: #ffffff;
  box-shadow: 0 2px 13px 0 rgba(41, 106, 192, 0.2);
  border-radius: 13px;
  margin: -7vw auto 0;
  padding: 2.5vw 0 2.5vw 3.5vw;
  position: relative;
  z-index: 1;
}
.get-start p {
  text-align: left;
}
.get-start h2 {
  text-align: left;
}
.get-start div {
  display: inline-block;
  vertical-align: middle;
}
.get-start div:nth-child(2) {
  width: 31.875vw;
  margin-left: 6.8vw;
}
.get-start img {
  width: 26.5vw;
  height: auto;
}
.get-start a {
  display: inline-block;
  width: 120px;
  height: 40px;
  border: 1px solid #006ee1;
  color: #006ee1;
  font-size: 18px;
  text-align: center;
  line-height: 40px;
  background: #fff;
  margin-top: 3.5vw;
  border-radius: 8px;
}
.get-start a:hover {
  border-color: #fff;
  color: #fff;
  background: #006ee1;
}
.browse-docu {
  width: 64vw;
  margin: 0 auto;
  min-height: 38vw;
  padding-top: 5vw;
}
.browse-docu h2,
.browse-docu h2 + p {
  text-align: center;
}
.change-guide {
  border-bottom: 1px solid #303c42;
  width: 46vw;
  margin: 2.5vw auto 6vw;
}
.change-guide span {
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  width: 32%;
  text-align: center;
  display: inline-block;
}
.change-guide span:hover,
.change-guide-active {
  color: #006ee1;
}
.change-guide span:hover:after,
.change-guide-active:after {
  color: #006ee1;
  border-bottom: 2px solid #006ee1;
  content: "";
  display: inline-block;
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
}
.dif-area .getaway-model {
  margin-top: -0.8vw;
}
.getaway-model a {
  display: block;
}
.guide-area {
  position: relative;
  min-height: 570px;
}
.dif-guide {
  position: absolute;
  display: none;
  width: 100%;
}
.dif-guide:first-child {
  display: block;
}
.dif-area {
  display: inline-block;
  vertical-align: top;
  width: 46%;
  box-shadow: 0 0 1.3vw 2px rgba(30, 93, 171, 0.08);
  margin: 0 3.5vw 2.6vw 0;
  padding: 2vw 1vw 1.5vw 1vw;
  background: #fff;
  border-radius: 7px;
  border-bottom: 7px solid #fff;
  position: relative;
}
.dif-area:hover {
  border-color: #3699ff;
}
.dif-area:nth-child(even) {
  margin-right: 0;
}
.dif-area h3 {
  font-size: 16px;
  color: #3d4a59;
  font-weight: 600;
  margin-top: 0;
  line-height: 24px;
}
.dif-area p {
  margin: 1vw 0;
  min-height: 3.65vw;
  text-align: left;
}
.dif-area div {
  display: inline-block;
  vertical-align: top;
}
.dif-area div:nth-child(2) {
  width: 21vw;
}
.dif-area img {
  width: 5vw;
  height: auto;
}
.dif-area span {
  position: relative;
  float: right;
}
div .pdf-href,
div .html-href {
  position: relative;
  display: inline-block;
  padding-left: 1.3vw;
  font-size: 16px;
  margin-right: 1vw;
  color: #006ee1;
}
div .pdf-href:hover {
  /*color: #d66973;*/
}
div .pdf-href:hover:after,
div .html-href:hover:after {
  content: "";
  border-bottom: 1px solid #006ee1;
  display: inline-block;
  position: absolute;
  right: 3px;
  width: 50%;
  bottom: 0;
}
div .html-href:hover {
  /*color: #03b5bd;*/
}
div .html-href:hover:after {
  /*border-bottom: 1px solid #03b5bd;  */
  width: 58%;
}
.pdf-href:before {
  content: "";
  background: url(../images/p-series/user-guide-pdf-icon.png) center no-repeat;
  background-size: 20px 20px;
  display: inline-block;
  position: absolute;
  left: 0;
  width: 20px;
  height: 20px;
}
.html-href:before {
  content: "";
  background: url(../images/p-series/user-guide-html-icon.png) center no-repeat;
  background-size: 16px 21px;
  display: inline-block;
  position: absolute;
  left: 0;
  width: 16px;
  height: 21px;
}
.trending-topics {
  width: 64vw;
  margin: 0 auto;
}
.trending-topics h2 {
  margin-top: 3.3vw;
}
.trending-topics p {
  text-align: center;
  margin-bottom: 5vw;
}
.trending-topics div div {
  display: inline-block;
  vertical-align: middle;
}
.trending-topics div div:nth-child(1) {
  width: 27vw;
  margin-right: 6.2vw;
}
.trending-topics div div:nth-child(2) img {
  width: 30.4vw;
}
.ask-questions a {
  display: block;
  font-size: 16px;
  color: #3d4a59;
  position: relative;
  padding: 0.8vw 0 0.8vw 2.8vw;
  line-height: 30px;
}
.ask-questions a:before {
  content: "";
  background: url(../images/p-series/question-icon.png) center no-repeat;
  background-size: 21px 21px;
  display: inline-block;
  position: absolute;
  left: 1vw;
  width: 21px;
  height: 21px;
  top: 19px;
}
.ask-questions a:hover {
  box-shadow: 0 0 1.3vw 2px rgba(30, 93, 171, 0.08);
  color: #006ee1;
}
.ask-questions a span {
  border-bottom: 1px solid #fff;
}
.ask-questions a:hover span {
  border-color: #006ee1;
}
.trending-topics .view-all,
.more-videos {
  display: block;
  width: 130px;
  height: 40px;
  background: #fff;
  margin: 3.07vw auto;
  text-align: center;
  color: #006ee1;
  line-height: 40px;
  font-size: 16px;
  border: 1px solid #006ee1;
  border-radius: 8px;
}
.view-all:hover,
.more-videos:hover {
  color: #fff;
  background: #006ee1;
  border-color: #006ee1;
}
.more-videos {
  background: #f6fdff;
}
.video-tutorials {
  background: #f6fdff;
  padding: 2vw 0 0.1vw;
}
.video-tutorials p {
  text-align: center;
}
.video-view {
  width: 67.5vw;
  margin: 0 auto;
  display: flex;
}
.video-view div {
  display: inline-block;
  vertical-align: top;
  margin: 3vw 3vw 0 0;
  background: #fff;
  transition: all 0.3s;
  width: 30.3%;
  padding-bottom: 2vw;
}
.video-view div img {
  cursor: pointer;
  width: 20.2vw;
  height: 11.3vw;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.video-view div:hover {
  box-shadow: 0 0 1.3vw 2px rgba(30, 93, 171, 0.3);
}
.video-view div:last-child {
  margin-right: 0;
}
.video-view h4 {
  font-size: 18px;
  padding: 1.3vw 0 0 1.5vw;
  background: #fff;
  width: 15vw;
  margin: 0;
  min-height: 5.5vw;
  line-height: 30px;
}
.more-resources h2 {
  margin: 4.2vw 0 3.5vw;
}
.resources-cont {
  width: 67.5vw;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
}
.resources-cont p {
  text-align: center;
}
.resources-cont div {
  display: inline-block;
  vertical-align: top;
  min-height: 17.5vw;
  position: relative;
  padding: 5vw 0;
  background: #fff;
  margin: 0 3.3vw 6vw 0;
  box-shadow: 0 0 1.3vw 2px rgb(30 93 171 / 20%);
  border-radius: 7px;
  width: 30%;
}
.resources-cont div:last-child {
  margin-right: 0;
}
.resources-cont div:first-child:after,
.resources-cont div:last-child:after {
  display: block;
  /*content: "";*/
  width: 1px;
  height: 50%;
  background: #ccc;
  position: absolute;
  top: 20%;
  right: -1.65vw;
  z-index: 1;
}
.resources-cont div:last-child:after {
  right: initial;
  left: -1.65vw;
}
.resources-cont div:hover {
  box-shadow: 0 0 1.3vw 2px rgba(30, 93, 171, 0.2);
}
.resources-cont div:first-child:hover:after,
.resources-cont div:last-child:hover:after {
  opacity: 0;
}
.resources-cont div:nth-child(2):hover {
  position: relative;
  z-index: 2;
}
.p-series-page a {
  font-size: 16px;
  /*line-height: 40px;*/
  /*font-weight: 600;*/
}
.resources-cont a {
  color: #101f3a;
  text-align: center;
  font-size: 24px;
  /*line-height: 36px;*/
}
.resources-cont a:hover {
  color: #006ee1;
  text-decoration: underline;
}
.resources-cont img {
  width: 3.85vw;
  height: auto;
  display: block;
  margin: 0 auto 2vw;
}
/*wath-the-video*/
.down-datasheet-from {
  width: 56.25vw;
  margin: auto;
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #626566;
  height: 31.6vw;
}
.down-datasheet-from .wpex-clr {
  padding-left: 0;
  padding-right: 0;
}
.form-alert {
  display: none;
}
.iframe-video {
  display: none;
}
.iframe-video:first-child {
  display: block;
}
.form-alert .close-x {
  position: absolute;
  z-index: 2;
  color: #fff;
  font-weight: 300;
  font-size: 0.93vw;
  display: inline-block;
  left: 55.5vw;
  top: -0.9vw;
  width: 1.6vw;
  height: 1.6vw;
  border: 1px solid #7d7d7d;
  border-radius: 50%;
  text-align: center;
  line-height: 1.5vw;
  background: #7d7d7d;
  cursor: pointer;
  -ms-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -o-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.form-alert .close-x:hover {
  -ms-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  background: red;
  color: #fff;
  border: 1px solid red;
}
.down-mask {
  background: #000;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  z-index: 999;
  opacity: 0.6;
}
.down-datasheet-from iframe {
  width: 56.25vw;
  height: 31.6vw;
}
/*  */

.linkus-titile-ippbx a {
  font-size: 14px !important;
  padding: 8px 12px !important;
  display: block !important;
  margin: 1px 5px !important;
  font-weight: bold !important;
  color: #004277 !important;
  line-height: 20px !important;
}

.space-fill {
  height: 10px;
  opacity: 0;
}
.linkus-titile-ippbx a:hover {
  color: white !important;
  background: #004277 !important;
}
/*switch menu*/
#switch-menu {
  height: 100px;
  padding-top: 20px;
  width: 85%;
  margin: 0 auto 2.5em;
}
.pbx:hover span {
  background: #edf3fb;
}
.app-center:hover span {
  background: #edf3fb;
}
.developer:hover span {
  text-decoration: underline;
  cursor: pointer;
}
#switch-menu div {
  background: #fff;
  height: 80px;
  max-width: 95%;
  margin: 0 auto;
  padding: 10px;
  background: #fafafa;
}
.span-pbx {
  display: inline-block;
  font-size: 28px !important;
  font-weight: 600 !important;
  width: 15%;
  height: 60px;
  line-height: 1.8 !important;
  text-align: center;
  margin: 0;
  border-top: 7px solid #fafafa;
  border-left: 1px solid #fafafa;
  border-right: 1px solid #fafafa;
  border-bottom: 1px solid #ccc;
  cursor: pointer;
  margin-left: -3px;
  transition: all 0.3s;
  color: #5e5e5e;
}
.span-app-center {
  display: inline-block;
  font-size: 28px !important;
  font-weight: 600 !important;
  width: 15%;
  height: 60px;
  line-height: 1.8 !important;
  text-align: center;
  margin: 0;
  border-top: 7px solid #fafafa;
  border-left: 1px solid #ccc;
  border-right: 1px solid #fafafa;
  border-bottom: 1px solid #ccc;
  cursor: pointer;
  margin-left: -3px;
  transition: all 0.3s;
  color: #5e5e5e;
}
.span-developer {
  font-size: 1.4em !important;
  font-weight: 500 !important;
  width: 12% !important;
  text-align: right;
  line-height: 3.6 !important;
  margin-left: -10px;
  background-size: 55px !important;
  background: url(../images/api.png) no-repeat;
  border-bottom: 1px solid #ccc;
  display: inline-block;
  background-position: 0% 100%;
  color: #3167b3;
  position: relative;
  top: -11px;
}
.app-center .click-active {
  border-top: 7px solid #1078b5;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #fafafa;
  color: #000;
}
.pbx .click-active {
  border-top: 7px solid #1078b5;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #fafafa;
  color: #000;
}
small.border-bottom {
  border-bottom: 1px solid #ccc;
  width: 56%;
  display: inline-block;
  position: relative;
  top: 18px;
  left: -4px;
}
#switch-menu div:after {
  display: inline-block;
  width: 100%;
  position: relative;
  top: -13px;
  height: 1px;
  background: #ccc;
}
/*Getting Started with
P-Series PBX System*/
.p-series-bx-system {
  background: url(../images/gat-start-with-p-series-pbx-system-bg.png) center
    no-repeat;
  background-size: cover;
  min-height: 30.9vw;
  padding: 6.5vw 0 0 8vw;
}
.p-series-bx-system h1 {
  color: #fff;
  font-size: 3.3vw;
  font-weight: 600;
  line-height: 4.6vw;
  margin: 0;
}
.p-series-bx-system p {
  width: 47vw;
  font-size: 1.3vw;
  color: #fff;
  line-height: 2.08vw;
  margin: 1.35vw 0 1.8vw;
}
.p-series-bx-system span {
  width: 12px;
  height: 12px;
  background: #f5b418;
  border-radius: 50%;
  display: inline-block;
  margin-right: 10px;
}
.tutorial-one h2,
.tutorial-two h2 {
  text-align: center;
  font-size: 2.6vw;
  margin: 5.2vw auto 2.5vw;
}
.tutorial-one h2 + p {
  width: 71vw;
  font-size: 1.3vw;
  line-height: 2.35vw;
  margin: 0 auto;
  font-weight: 300;
}
.objectives {
  width: 69vw;
  margin: 4.5vw auto 0;
}
.objectives img,
.objectives div {
  display: inline-block;
  vertical-align: top;
}
.objectives img {
  width: 28.6vw;
  margin-right: 10vw;
}
.objectives h3 {
  font-size: 1.6vw;
  margin-bottom: 2.3vw;
  margin-top: 0;
}
.objectives p {
  font-size: 20px;
  width: 30vw;
  min-height: 3.5vw;
  background: rgba(238, 241, 246, 0.5);
  border-radius: 0px 34px 34px 0px;
  border-left: 5px solid #0082cc;
  line-height: 3.5vw;
  margin-bottom: 1.6vw;
}
.objectives p span {
  font-size: 1.5vw;
  font-weight: 600;
  color: #0070c0;
  display: inline-block;
  margin: 0 1vw 0 1.5vw;
  transform: rotate(3deg);
}
.tutorial-btn {
  width: 15vw;
  height: 3.9vw;
  background: #fff;
  border-radius: 4px;
  display: block;
  color: #0070c0;
  font-size: 1.56vw;
  text-align: center;
  line-height: 3.9vw;
  margin: 3.6vw auto 0;
  cursor: pointer;
  border: 1px solid #0070c0;
  border-radius: 5px;
}
.tutorial-btn:hover {
  background: #0070c0;
  color: #fff;
}
.objectives-active .p-content-right,
.objectives-active .p-content-left {
  display: inline-block;
  vertical-align: top;
}
.getting-started-tutorial {
  position: relative;
}
.p-series-list > div .tutorial-one,
.p-series-list > div .tutorial-two {
  width: 71vw;
  margin: 7.5vw auto;
  background: #fff;
  left: 0;
  right: 0;
  display: none;
}
.p-series-list > div .tutorial-one {
  display: block;
  width: 91vw;
  margin-bottom: 5vw;
}
.objectives-active .p-content-left {
  width: 21vw;
  border-radius: 7px;
  box-shadow: 0 0 1vw rgba(61, 74, 89, 0.1);
  margin-right: 3.5vw;
  background: #eef1f6;
}
.objectives-active .fixed-ele {
  position: fixed;
  z-index: 1;
  top: 2vw;
}
.objectives-active .absolute-ele {
  position: absolute;
  bottom: 3vw;
}
.p-content-left .p-title-text {
  font-size: 1.6vw;
  color: #fff;
  background: #0070c0;
  margin-bottom: 0;
  padding-left: 15px;
  padding: 1.5vw 1vw;
}
.p-title-text img {
  width: 3vw;
  margin-right: 1vw;
}
.p-title-text img {
  width: 3vw;
  margin-right: 1vw;
}
.little-point {
  background: #eef1f6;
  margin-bottom: 0;
}
.little-point span {
  display: block;
  font-size: 18px;
  line-height: 30px;
}
.little-point .title {
  background: #eef1f6;
  position: relative;
  padding: 1.5vw 2.5vw 1.5vw 2.3vw;
  cursor: pointer;
}
.little-point .title:before {
  content: "";
  border-right: 2px solid #0070c0;
  border-top: 2px solid #0070c0;
  width: 10px;
  height: 10px;
  display: inline-block;
  transform: rotate(45deg);
  position: absolute;
  left: 0.8vw;
  top: 2vw;
}
.point-red-end .title:after {
  content: "";
  display: inline-block;
  position: absolute;
  width: 22px;
  height: 21px;
  background: url(../images/arealy-read-gray-icon.png) center no-repeat;
  background-size: cover;
  right: 1vw;
  top: 1.6vw;
}
.little-point .blue-font {
  font-size: 1.2vw;
  color: #3d4a59;
  margin-bottom: 8px;
  font-weight: 500;
}
.little-point .detail {
  display: none;
}
.little-point .detail span {
  margin: 0 0 1vw;
  position: relative;
  padding: 0 4vw 0.5vw 4vw;
  cursor: pointer;
}
.little-point .detail span:last-child {
  padding-bottom: 2vw;
  margin-bottom: 0;
}
.little-point .detail span:before {
  content: "";
  display: inline-block;
  width: 18px;
  height: 18px;
  border: 2px solid rgb(203, 214, 226);
  border-radius: 50%;
  position: absolute;
  left: 2.1vw;
  top: 6px;
  background: #eef1f6;
}
.little-point .detail span:after {
  content: "";
  display: inline-block;
  position: absolute;
  left: 2.5vw;
  top: 1.3vw;
  height: 100%;
  border: 1px solid rgb(203, 214, 226);
}
.little-point .detail span:last-child:after {
  display: none;
}
.little-point-active .title {
  background: #eef1f6;
}
.little-point-active .title:before {
  transform: rotate(135deg);
  top: 1.8vw;
}
.little-point-active .detail {
  display: block;
}
.detail span.read-now:before {
  content: "";
  border-color: #0070c0;
}
.detail span.read-now:after {
  border-color: rgb(203, 214, 226);
  border-style: solid;
}
.detail span.read-end:before,
.detail span.read-end:after {
  border-color: #0070c0;
  border-style: solid;
}
.detail span.read-end:before {
  background: #0070c0;
  content: "√";
  font-size: 14px;
  color: #fff;
  line-height: 18px;
  text-align: center;
}
.detail span.read-end-now:before {
  background: #eef1f6;
  color: #0070c0;
}
.objectives-active .p-content-right {
  width: 45vw;
  background: #ffffff;
  padding: 0 2.6vw 2.6vw;
  position: relative;
}
.objectives-active .relative-left {
  position: relative;
  left: 25vw;
}
.p-content-right .content-list {
  display: none;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 100%;
}
.p-content-right .content-list:nth-child(1) {
  display: block;
}
.p-content-right .content-list > div {
  position: relative;
}
.p-content-right .content-div {
  background: #fff;
  display: none;
}
.p-content-right .content-div:nth-child(1) {
  display: block;
}
.function-p img,
.function-p .info-span {
  display: inline-block;
  vertical-align: top;
}
.function-p img {
  width: 2.2vw;
  margin-right: 1vw;
}
.function-p .info-span {
  width: 33vw;
}
.p-content-right p {
  font-size: 18px;
  line-height: 30px;
  display: block !important;
}
.content-list h3 {
  text-align: left;
  margin-bottom: 2vw;
  margin-top: 0;
  font-size: 30px;
  font-weight: 400;
}
.content-1 li {
  font-size: 16px;
  font-weight: 300;
  margin-bottom: -0.3vw;
}
.content-1 h3 + p {
  text-align: left;
  font-size: 16px;
}
.function-p {
  background: rgba(238, 241, 246, 0.5);
  padding: 1.5vw 1.2vw;
  margin-top: 2vw;
  border-radius: 10px;
}
.info-span span:nth-child(1) {
  font-size: 1.2vw;
  color: #0070c0;
  margin-bottom: 0.3vw;
  display: inline-block;
}
.info-span span:nth-child(2) {
  display: block;
}
.p-series-prev-btn,
.p-series-next-btn {
  font-size: 16px;
  font-weight: 300;
  position: absolute;
  left: 1.6vw;
  bottom: -1vw;
  cursor: pointer;
  border: 1px solid #e3e3e3;
  padding: 0 1.5vw;
  margin-bottom: -3vw;
  color: #fff;
  background: #0070c0;
}
.p-series-tutorial-bottom-nav {
  color: #5e5e5e;
  position: absolute;
  left: 6.6vw;
  bottom: -1vw;
  cursor: pointer;
  border-top: 1px solid #e3e3e3;
  border-bottom: 1px solid #e3e3e3;
  text-align: center;
  width: 48vw;
  font-weight: 300;
  margin-bottom: -3vw;
}
.p-series-next-btn {
  left: initial;
  right: 1.6vw;
}

.btn-cant-click {
  pointer-events: none;
  color: #b9bfc7;
  background: #fff;
}
.p-content-right .procedure {
  display: block;
  clear: both;
}
.p-content-right .have-num {
  position: relative;
  padding-left: 1.5vw;
  margin-top: 1.5vw;
  font-size: 16px;
}
.have-num span {
  width: 20px;
  background: #0070c0;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  color: #fff;
  line-height: 20px;
  font-size: 14px;
  position: absolute;
  left: 0;
  top: 2px;
}
.p-content-right .small-tip {
  margin-left: 1.5vw;
  font-weight: 300;
  margin-bottom: 0;
}
.p-content-right .content-3 .procedure {
  position: relative;
  top: 0.8vw;
}
/**/
.tools-and-resources {
  background: rgba(238, 241, 246, 0.5);
  margin-top: 3vw;
  padding: 5.5vw 0;
}
.tools-and-resources h2 {
  font-size: 2.3vw;
  margin: 0 0 1.3vw 0;
  text-align: center;
}
.tools-div {
  width: 68vw;
  margin: 3vw auto 0;
}
.tools-div div {
  display: inline-block;
  vertical-align: top;
  text-align: center;
}
.tools-div p {
  font-size: 18px;
  line-height: 30px;
}
.tools-div div img {
  width: 3.78vw;
}
.tools-div h3 {
  font-size: 1.3vw;
  margin: 1.3vw 0 1vw;
  font-weight: 600;
}
.tools-div div {
  display: inline-block;
  vertical-align: top;
  text-align: center;
  width: 17vw;
  margin-right: 7.9vw;
}
.tools-div div:last-child {
  margin-right: 0;
}

/* 侧边栏 */
#page-side-bar {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  position: fixed;
  z-index: 2;
  top: 400px;
  bottom: 0;
  right: 0;
  height: fit-content;
  margin: auto;
}
#page-side-bar .content-wrap1 {
  width: 13px;
  padding: 6px 0;
  border-radius: 1px;
  cursor: pointer;
  background-color: #f7f9fa;
  display: none;
}
#page-side-bar .content-wrap1 img {
  width: 100%;
}
#page-side-bar .content-wrap2 {
  display: flex;
}
#page-side-bar .content-wrap2 .link-wrap {
  height: 235px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  /* padding: 17px 0 14px; */
}
#page-side-bar .content-wrap2 .link-wrap2 {
  height: 220px;
  padding: 3px 0 0;
}

#page-side-bar .content-wrap2 .img-wrap {
  display: flex;
  width: 51px;
  height: 235px;
  background-color: #f7f9fa;
  flex-direction: column;
  justify-content: space-around;
  padding: 15px 0;
  border-radius: 25px;
}
#page-side-bar .content-wrap2 .img-wrap.img-change {
  background-color: #006EE1;
}
#page-side-bar .content-wrap2 .img-wrap.img-change img {
  opacity: 0.3;
}
div#page-side-bar .content-wrap2 .img-wrap.img-change .img-active {
  opacity: 1;
}
#page-side-bar .content-wrap2 .img-wrap-cn {
  height: 180px;
}
#page-side-bar .content-wrap2 .link-wrap-cn {
  height: 180px;
  padding: 13px 0 7px;
}

#page-side-bar .content-wrap2 .img-wrap2 {
  height: 220px;
}

#page-side-bar .content-wrap2 img {
  width: 45px;
  border-radius: 50%;
  cursor: pointer;
  display: block;
  margin: 5px auto;
}
#page-side-bar .content-wrap2 img.collapse-img {
  width: 40px;
}
#page-side-bar .content-wrap2 div a {
  border-radius: 6px;
  line-height: 0;
  padding: 0 15px;
  width: 0;
  margin: 0 5px 0 auto;
  font-size: 14px;
  background-color: #F7F9FA;
  color: #303c42;
  position: relative;
  z-index: -1;
  opacity: 0;
  display: block;
  height: 45px;
  cursor:text;
}

#page-side-bar .content-wrap2 div a.collapse,
#page-side-bar .content-wrap2 div a.collapse:hover {
  text-decoration: none;
  color: #303c42;
}
#page-side-bar .content-wrap2 div a.wrap-active {
  opacity: 1;
  z-index: 0;
  width: max-content;
  line-height: 45px;
}
@media (max-width: 1800px) and (min-width: 1501px) {
 
@media (max-width: 1500px) and (min-width: 769px) {
  .wh_main_page_toc {
    width: 1100px;
  }
 
  /*  */
  #switch-menu {
    height: 90px;
    width: 96%;
  }
  #switch-menu span {
    height: 57px;
  }
  .span-app-center {
    margin-left: -4px;
  }
  .span-developer {
    top: 0;
  }
  #switch-menu div {
    height: 70px;
  }
  small.border-bottom {
    top: 15px;
  }
  .wh_tile {
    margin: 0.9em;
    width: 29%;
  }
  .content-area,
  .policy-cookie,
  .follow-wrap {
    width: 1100px;
    max-width: 90%;
  }
  /*Getting Started with
*P-Series PBX System*/
  .objectives p {
    font-size: 1.25vw;
    width: 32vw;
  }
  .objectives img {
    margin-right: 8vw;
  }
  .little-point span {
    font-size: 14px;
    line-height: 27px;
  }
  .p-content-right p,
  .tools-div p {
    font-size: 16px;
    line-height: 27px;
  }

  .little-point .detail span:after {
    left: 2.7vw;
    top: 1.7vw;
  }
  .p-content-right .have-num,
  .p-content-right .small-tip {
    padding-left: 28px;
  }
  .little-point .blue-font {
    margin-bottom: 0;
  }

  .p-content-right .procedure {
    font-size: 26px;
    font-weight: 400;
    margin-top: 30px;
    margin-bottom: 18px;
  }
  .p-series-list > div .tutorial-one,
  .p-series-list > div .tutorial-two {
    width: 71vw;
  }
  .objectives-active .p-content-right {
    width: 58vw;
    padding: 0 1vw 2.6vw;
  }
  .p-content-right .content-div {
    width: 100%;
  }
  .tools-div div {
    width: 18vw;
    margin-right: 6.5vw;
  }
  .info-span span:nth-child(1) {
    font-size: 1.4vw;
  }
  .p-series-list > div .tutorial-two {
    width: 86vw;
    margin-top: 5vw;
  }
  .objectives-active .p-content-left {
    width: 23vw;
  }
  .little-point .detail span:after {
    height: 90%;
  }
  .function-p .info-span {
    width: 90%;
  }
  .objectives-active .relative-left {
    left: 27vw;
  }
  /**/
  #ug-editor-name input[type="search"],
  #apply-edite {
    font-size: 16px;
    /* width: 300px; */
    height: 45px;
  }
  #apply-edite {
    width: 175px;
  }
  #apply-edite {
    background-position-x: 10vw;
  }
  .change-guide span {
    /*margin-right: 8vw;*/
  }
  .pdf-href:before {
    background-size: 16px 16px;
    width: 16px;
    height: 16px;
    top: 5px;
  }
  .html-href:before {
    background-size: 15px 20px;
    width: 15px;
    height: 20px;
    /*top: 5px;*/
  }
  .trending-topics {
    width: 70vw;
  }
  .trending-topics div div:nth-child(1) {
    width: 33vw;
  }
  .video-view h4 {
    width: 20vw;
  }
  .trending-topics .view-all,
  .more-videos {
    width: 120px;
  }
  div .pdf-href,
  div .html-href {
    font-size: 14px;
  }
  .resources-cont p {
    /*width: 147px;*/
  }
  .resources-cont div {
    /*padding: 4.7vw;*/
  }
  .browse-docu {
    width: 67vw;
  }
  .dif-area {
    width: 31.3vw;
  }
  .dif-area div:nth-child(2) {
    width: 23vw;
  }
}

@media (max-width: 1280px) and (min-width: 769px) {
 
  
  /**/
  #apply-edite {
    appearance: auto;
    background: none;
    background-position-x: initial;
  }
  .change-guide span {
    /*margin-right: 7vw;*/
  }
  .browse-docu {
    width: 70vw;
  }
  .dif-area {
    width: 32.5vw;
  }
  .dif-area div:nth-child(2) {
    width: 25vw;
  }
  .ask-questions a:before {
    background-size: 18px 18px;
    width: 18px;
    height: 18px;
  }
  .trending-topics div div:nth-child(2) img {
    margin-top: 5vw;
  }
}
@media (max-width: 1152px) and (min-width: 769px) {
  .span-developer {
    width: 14% !important;
  }
  #switch-menu span {
    font-size: 23px !important;
    line-height: 54px !important;
  }
  .span-developer {
    width: 16% !important;
    background-size: 48px !important;
    margin-left: -25px;
    position: relative;
    top: -7px;
  }
 
  #switch-menu {
    width: 100%;
  }
  .info-span span:nth-child(1) {
    font-size: 18px;
  }
  .function-p img {
    width: 50px;
  }
  #ug-editor-name h1 {
    font-size: 2.3vw;
  }
  #ug-editor-name input[type="search"] {
    width: 22vw;
  }
  #apply-edite {
    /*width: 15vw;*/
    font-size: 15px;
  }
  .change-guide {
    width: 52vw;
  }
  .p-series-page p {
    font-size: 14px;
    line-height: 22px;
  }
  div .pdf-href,
  div .html-href {
    font-size: 14px;
  }
  .pdf-href:before {
    background-size: 16px 16px;
    width: 16px;
    height: 16px;
  }
  .html-href:before {
    background-size: 14px 20px;
    width: 14px;
    height: 20px;
  }
  .trending-topics .view-all,
  .more-videos {
    width: 12vw;
  }
}
@media (max-width: 800px) {
  .content-area {
    flex-wrap: wrap;
  }
  .content-ul {
    margin-right: 10px;
    margin-top: 6px;
  }
  .content-ul span a {
    margin: 0 5px;
    font-size: 16px;
  }
  #searchForm {
    width: 150px;
  }
  .free-trial a {
    padding: 9px 15px;
    font-size: 15px;
  }
  
  #switch-menu span,
  .change-guide span {
    font-size: 16px;
  }
  .change-guide span {
    line-height: 30px;
  }
  small.border-bottom {
    top: 13px;
  }
  .content-area a {
    font-size: 14px;
  }
  /*Yeastar P-Series PBX System*/
}
@media (max-width: 768px) {
  /*  */
  .tem-bec-par {
    min-height: 200px;
  }
  .tem-bec-par .become-partner-temp {
    font-size: 20px;
    margin: 0 auto;
    line-height: 30px;
  }
  
  .container-fluid {
    max-width: 95%;
  }
  .get-start div a {
    font-size: 16px;
  }
  /*cloudpbx head*/

  
  #searchForm {
    width: 210px;
  }
  .wh_search_input {
    padding-left: 150px;
  }


  

  
  .free-trial a {
    padding: 5px 15px;
  }
  .desktop-nav__product-switcher {
    padding-left: 0;
    display: block;
  }
  .product-switcher--desktop .product-switcher__menu {
    position: relative;
    top: 0;
  }
  .product-switcher-button__caret svg {
    left: 0;
  }
  .wh_header {
    position: initial;
  }
  .wh_tile {
    width: 100%;
  }
  /*cloudpbx category*/
  .pbx .click-active {
    border: none;
    color: #fff;
    height: initial;
    background: #0070c0;
  }
  .span-pbx {
    font-size: 23px !important;
    width: 18%;
    border: none;
    line-height: initial;
  }
  .span-app-center {
    font-size: 23px !important;
    width: 42%;
    height: initial;
    border: none;
  }
  small.border-bottom {
    display: none;
  }
  .span-developer {
    width: 39% !important;
    background-size: 40px !important;
    background-position: 5% 61%;
    top: 0;
    border: none;
    text-align: right;
    height: initial;
  }
  #switch-menu {
    width: 100%;
    margin: 0 auto;
  }
  #switch-menu div {
    max-width: 100%;
  }
  .pbx:hover span {
    background: none;
    color: #0070c0;
  }
  /**/
  .down-datasheet-from {
    width: 90%;
    height: 31.6vw;
  }
  .form-alert .close-x {
    font-size: 4vw;
    left: 85.5vw;
    top: -3.9vw;
    width: 7vw;
    height: 7vw;
    line-height: 6vw;
  }
  /*cloud end*/
  .log-and-content {
    padding: 0;
    height: 11rem;
  }
  .pdf-down,
  .language {
    padding: 0 0 0 2.5rem;
    width: 11rem;
  }
  .yeastar-log a:nth-child(1) {
    background: url(https://www.yeastar.com/wp-content/uploads/2018/05/yeastar_white2.png)
      no-repeat center;
    height: 40px;
    width: 123px;
    margin-top: 7px;
  }
  .yeastar-log a:nth-child(2) {
    margin-top: 24px;
    padding-left: 20px;
    top: -8px;
    margin-left: 20px;
  }
  .content-ul {
    margin-right: 9px;
    margin-top: 5px;
    float: left;
  }
  .content-ul span a {
    margin: 0 4px;
    font-size: 15px;
  }
  
  /* footer menu */
  .menu-content {
    padding: 16px 0px;
  }
  .content-area {
    flex-wrap: wrap;
    padding: 0;
    width: 95%;
  }
  .content-area div {
    width: 50%;
    margin-bottom: 30px;
  }
  .footerleft {
    padding: 30px 0 8px;
    flex-wrap: wrap;
  }
  .followlink {
    margin-top: 20px;
  }
  .zh-cn-footer .content-area div:nth-child(1) {
    width: 100%;
  }
  .zh-cn-footer .content-area div {
    width: 30%;
  }
  .zh-cn-footer  .follow-wrap {
    flex-wrap: wrap;
  }
  .followwp {
    margin-left: 0;
  }
  /*Getting Started with
P-Series PBX System*/
  .p-series-bx-system {
    padding: 8vw 0 8vw 3vw;
  }
  .p-series-bx-system h1 {
    font-size: 20px;
    line-height: 30px;
  }
  .p-series-bx-system p,
  .tools-div p {
    width: 100%;
    font-size: 16px;
    line-height: 22px;
  }
  .tutorial-one h2,
  .tutorial-two h2 {
    font-size: 20px;
  }
  .p-series-list > div .tutorial-one,
  .p-series-list > div .tutorial-two,
  .objectives {
    width: 95%;
  }
  .tutorial-one h2 + p,
  .content-1 h3 + p,
  .p-content-right p {
    width: 100%;
    font-size: 16px;
    line-height: 22px;
  }
  .objectives img,
  .objectives div {
    width: 100%;
  }
  .objectives h3 {
    font-size: 25px;
    margin-bottom: 20px;
    margin-top: 30px;
  }
  .objectives p {
    font-size: 16px;
    width: 100%;
    border-left: 5px solid #0082cc;
    line-height: 22px;
    padding: 12px 10px;
  }
  .objectives p span,
  .content-list h3 {
    font-size: 20px;
  }
  .tutorial-btn {
    width: 150px;
    height: 40px;
    font-size: 20px;
    line-height: 40px;
  }
  .objectives-active .p-content-left {
    width: 100%;
  }
  .objectives-active .p-content-right,
  .objectives-active .p-content-left {
    height: initial;
    width: 100%;
    margin-right: 0;
    overflow-y: initial;
  }
  .little-point .blue-font {
    font-size: 18px;
    margin-bottom: 0;
  }
  .little-point .title {
    padding: 2vw 0 2vw 5vw;
  }
  .little-point .title:before {
    top: 4vw;
  }
  .little-point-active .title:before {
    top: 4vw;
  }
  .little-point .detail span:before {
    left: 5.5vw;
  }
  .little-point .detail span {
    margin: 0 0 2vw;
    padding: 0 1vw 0 12vw;
  }
  .little-point .detail span:after {
    top: 6.3vw;
    left: 7.5vw;
  }
  .p-content-right .content-div {
    height: initial;
    overflow-y: initial;
  }
  .info-span span:nth-child(1) {
    font-size: 18px;
  }
  .function-p .info-span {
    width: 100%;
  }
  .function-p img {
    width: 50px;
  }
  .function-p {
    padding: 16px 10px;
  }
  .objectives-active .p-content-right {
    min-height: 850px;
  }
  .p-content-right .have-num {
    padding-left: 6.5vw;
  }
  .p-content-right .small-tip {
    margin-left: 6.5vw;
    padding-right: 15px;
  }
  .tools-and-resources h2 {
    font-size: 25px;
  }
  .tools-div div img {
    width: 50px;
  }
  .tools-div div {
    width: 100%;
    margin: 20px 0 0 0;
  }
  .tools-div h3 {
    margin: 20px 0 10px;
    font-size: 18px;
  }
  .p-title-text img {
    width: 30px;
  }
  .p-content-left .p-title-text {
    font-size: 18px;
  }
  .p-content-right .content-list {
    width: 100%;
  }
  .resources-cont a {
    font-size: 20px;
  }
  .p-series-page a {
    font-size: 16px;
  }
}