.stoitem #sticomment {
    width: 100%;
}

.stoitem #stiparsets {
    width: 100%;
}

.stoitem #sticomment .hdr {
    display: none;
}

.stiinfo>.cnt {
    grid-template-areas:
        "code code"
        "pagecount pagecount"
        "desc desc"
        "actone actone"
        "acttwo acttwo"
        "actthree actthree"
        "actfour actfour"
        "gifts gifts"
        "price price"
        "rent rent"
        "contact contact"
        "avail avail"
        "order order"
        "plus plus";
}

.stiinfo>.hdr h1 {
    font-size  : 28px !important;
    line-height: 32px !important;
}

.stiinfo .stiysttitembox {
    background-image: none !important;
    background-color: #E6F4FE;
    padding         : 8px 16px !important;
    position        : relative;
    border          : none !important;
    color           : #113264;
    border-left     : 4px solid #8EC8F6 !important;

    p.hookplus {
        font-weight: bold;
        color      : inherit !important;
    }

    a {
        font-weight: normal;
    }

    img {
        width  : 40px;
        height : 40px;
        display: none;
    }
}

.stiinfo .stiysttitembox .thmbimg {
    display : block;
    position: absolute;
    left    : 8px;
}

.pop {
    font-size  : 15px;
    line-height: 24px;
    max-width  : 880px;
    margin     : 0 auto;
    color      : #1C2024;

    h1 {
        font-size    : 28px !important;
        line-height  : 32px !important;
        margin-bottom: 16px !important;
    }

    h2 {
        font-size    : 24px;
        line-height  : 28px;
        margin-bottom: 12px;
    }

    h3 {
        font-size    : 20px;
        line-height  : 24px;
        margin-bottom: 12px;
    }

    p+h3 {
        margin-top: 24px;
    }

    ul {
        padding: 12px 0 0 24px;

        li {
            list-style-type: disc;
            float          : unset;
        }
    }

    p+p {
        margin-top: 12px;
    }
}

.pop>div {
    padding-block: 32px;
}

.pop-header {
    padding-top: 0 !important;
}

.pop-keynotes {
    ul {
        padding              : 8px;
        margin-block         : 16px 0;
        display              : grid;
        gap                  : 8px;
        grid-template-columns: 1fr 1fr;
        background-color     : black;
        border-radius        : 8px;

        @media (max-width: 719px) {
            grid-template-columns: 1fr;
        }

        li {
            list-style-type : none;
            background-color: white;
            padding         : 16px 16px 24px 16px;
            font-size       : 14px;
            line-height     : 20px;
            color           : hsl(220, 6%, 35%);
            border-radius   : 4px;

            strong {
                display      : block;
                font-size    : 16px;
                line-height  : 20px;
                margin-bottom: 8px;
                color        : #1C2024;
            }

            strong:before {
                content     : url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%2330A46C' fill-rule='evenodd' d='M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2S2 6.477 2 12s4.477 10 10 10m.75-13a.75.75 0 0 0-1.5 0v2.25H9a.75.75 0 0 0 0 1.5h2.25V15a.75.75 0 0 0 1.5 0v-2.25H15a.75.75 0 0 0 0-1.5h-2.25z' clip-rule='evenodd'/%3E%3C/svg%3E");
                margin-right: 8px;
                position    : relative;
                top         : 6px;
            }
        }
    }
}

.pop-imageblock {
    display    : flex;
    gap        : 32px;
    align-items: center;

    img {
        width        : 100%;
        max-width    : 320px !important;
        height       : auto !important;
        max-height   : 320px;
        aspect-ratio : 1/1 !important;
        border-radius: 12px;
    }

    @media (max-width: 719px) {
        flex-direction: column-reverse;
    }
}

.pop div:has(.pop-toggle) {
    padding-block: 12px;
}

.pop-toggle {
    summary {
        cursor       : pointer;
        font-size    : 24px;
        line-height  : 28px;
        font-weight  : bold;
        border-bottom: 1px dotted #8b8d987a;
        padding      : 8px 0;
    }

    summary::marker {
        content     : "+ ";
        margin-right: 8px;
    }

    p:first-of-type {
        margin-top: 16px;

    }
}

.pop-toggle:open {
    padding-block: 0 24px;

    summary::marker {
        content: "- ";
    }
}

.pop-whyus {
    margin-top : 0;
    padding-top: 0;

    li {
        margin-bottom: 8px;
        line-height  : 20px;
    }

    li::marker {
        color    : #30A46C;
        font-size: 20px;
    }
}

.pop-designjetpartner {
    display    : flex;
    gap        : 12px;
    align-items: center;
    padding-top: 20px;
    width      : 100%;

    p {
        font-size  : 12px !important;
        line-height: 16px !important;
    }

    span {
        display    : block;
        font-weight: bold;
        font-size  : 15px !important;
        line-height: 16px !important;
    }

    img {
        width : 32px;
        height: 32px;
    }
}