.pm-container {
    position: relative;
    margin-top: 20px;
    font-family: Arial, sans-serif;
}
.pm-background {
    position: absolute;
    background-repeat: no-repeat;
}
.pm-text {
    position: absolute;
    z-index: 20;
    font-size: 12px;
    font-weight: normal;
    white-space: pre;
    user-select: none;
}
.pm-link {
    cursor: pointer
}
.pm-link:hover {
    text-shadow: 0 0 10px #fff100;
}
.pm-popup {
    display: none;
    position: absolute; z-index: 30
}

.pm-information {
    font-size: 13px;
    line-height: 22px
}

/* pm-bubble */
.pm-bubble {
    position: relative;
    z-index: 31;
    padding: 9px 12px 1px;
    border-color: #ddd; border-style: solid; border-width: 2px 1px;
    width: 150px;
    background-color: #FFF;
    box-sizing: border-box
}

.pm-popup-body {}

.pm-popup-header {
    position: absolute; z-index: 32; top:10px; right: 12px
}
.pm-popup-close {
    font-size: 12px; font-weight: normal; color: #898a8a;
    cursor: pointer
}

.pm-popup-effect {
    font-size: 13px; font-weight: bold; color: #6a4b92
}

.pm-popup-effect>.pm-popup-product:first-child {
    padding-top: 3px; border-top: 1px solid #c3c3c3; margin-top: 4px
}

.pm-popup-effect>.pm-popup-product:last-child {
    padding-bottom: 5px
}

.pm-popup-effect>.pm-popup-product {
    font-size: 12px; font-weight: normal; color: #331515;
    line-height: 18px; word-break: break-all
}
.pm-popup-product>a {
    color: #331515;
    text-decoration: none;
}

.pm-bubble-left   { margin: 0 0 0 9px }
.pm-bubble-right  { margin: 0 9px 0 0 }
.pm-bubble-top    { margin: 9px 0 0 0 }
.pm-bubble-bottom { margin: 0 0 9px 0 }

/* Bubble Arrow */
.pm-arrow        { position: absolute; z-index: 32 }
.pm-arrow:before { content:"";  display: block;  border: 10px solid transparent }
.pm-arrow:after  { content: ""; display: block;  border: 9px solid transparent }

.pm-arrow-top        { width: 20px; height: 10px; top: -8px; left: 65px }
.pm-arrow-top:before { border-bottom-color: #ebe4f6;  border-top-width: 0 }
.pm-arrow-top:after  { border-bottom-color: #FFF;  border-top-width: 0;  margin-top: -7px }

.pm-arrow-bottom        { width: 20px; height: 10px; top: auto; left: 65px }
.pm-arrow-bottom:before { border-top-color: #ebe4f6;  border-bottom-width: 0 }
.pm-arrow-bottom:after  { border-top-color: #FFF;  border-bottom-width: 0;  margin-top: -12px }

.pm-arrow-left        { width: 10px; height: 20px; margin-top: 1px; top: auto; left: -9px }
.pm-arrow-left:before { border-right-color: #ebe4f6;  border-left-width: 0 }
.pm-arrow-left:after  { border-right-color: #FFF;  border-left-width: 0;  margin-top: -19px }

.pm-arrow-right        { width: 10px; height: 20px; margin-top: 1px; top: auto; right: -9px }
.pm-arrow-right:before { border-left-color: #ebe4f6;  border-right-width: 0 }
.pm-arrow-right:after  { border-left-color: #FFF;  border-right-width: 0;  margin-top: -19px }

/* pm-view */
.pm-view { margin-top: 10px; color: #6a4b92 }
.pm-view > span { height: 20px; font-weight: bold;  line-height: 20px }
.pm-view:hover { cursor: pointer; color: #F60  }
.pm-view > span >.icon-angle-down { margin-right: 11px; font-weight: bold }
.pm-view > span >.icon-picture { margin-left:8px; font-weight: normal; font-size: 13px }

/* pm-download */
.pm-collapse { padding: 20px 0; font-size: 14px }
.pm-collapse-icon { margin-right: 28px; cursor: pointer }
.pm-collapse-icon > i { margin-right: 13px; font-weight: bold }
.pm-collapse-icon:after { content: "Collapse"; font-weight: bold }
.pm-download { display: inline-block; cursor: pointer }
.pm-download  .icon-download-alt { margin: 0 5px }

/*pathway-popup*/
.pathway-popup {
    display: none;
    position: fixed; z-index: 999; top: 0; left: 0;
    width: 100%; height: 100%;
    background: rgba(0,0,0,.5);
}

.pp-outer {
    position: absolute; z-index: 1000;
    width: 1030px; top: 0; left: 50%; margin-left: -520px;
    overflow: auto;
}

.pp-inner {
    position: fixed; z-index: 1001; top: 0; bottom: 0;
    width: 1030px;
    overflow: hidden;
}

.pp-content {
    width: 1047px;
    overflow-y: auto;
    overflow-x: hidden;
    height: 100%;
}

.pp-description {
    position: relative;
    padding: 15px;
    background-color: #FFF;
    line-height: 20px; text-align: justify
}

.pp-close {
    position: absolute; top: 5px; right: 10px;
    color: #898a8a;
    cursor: pointer;
}

.pp-description > img { display: block; margin-bottom: 15px }

@media screen and (max-width: 1000px) {
    .pp-outer   { width: 830px; margin-left: -415px; }
    .pp-inner   { width: 830px }
    .pp-content { width: 847px }
    .pp-description > img { width: 800px }
}

