.msite-mycontent-container {
    padding:1rem;
    padding-bottom: 1.5rem;
    padding-left:2.5rem;
    padding-right:2.5rem;
}

.msit-container-visitor .subscription-message {
    border-radius: 0.5rem;
    background-color: #FFE8A1;
    padding:2.5rem;
    margin:1.5rem;
    word-break: keep-all;
    display:grid;
    justify-items: stretch;
    align-items: center;
    grid-template-columns: 100px 1fr;
    gap:0.2rem;
    grid-template-areas: 
        'sbmsg-icon sbmsg-title'
        'sbmsg-icon sbmsg-desc'
        'sbmsg-icon sbmsg-action';
}

.msit-container-visitor .subscription-message .sbmsg-icon {
    grid-area: sbmsg-icon;
}

.msit-container-visitor .subscription-message .sbmsg-icon > i {
    font-size:50px;
    align-self: center;
}

.msit-container-visitor .subscription-message .sbmsg-title {
    grid-area: sbmsg-title;
    justify-self: left;
    font-weight: bold;
}

.msit-container-visitor .subscription-message .sbmsg-desc {
    grid-area: sbmsg-desc;
    justify-self: left;
    text-align: left;
}

.msit-container-visitor .subscription-message .sbmsg-action {
    margin-top:1rem;
    grid-area: sbmsg-action;
    justify-self: left;
    text-align: left;
}

.msite-mycontent-container .prod-box {
    display:grid;
    grid-template-columns: 100px 1fr auto;
    grid-template-rows: auto;
    gap: 1.2rem;
    align-items: start;
    margin-top:0.3rem;
    padding-bottom:0.5rem;
    border-bottom:1px solid rgb(64, 64, 64);
    width:650px;
    margin-left: auto;
    margin-right: auto;
}

.msite-mycontent-container .prod-box:first-child {
    margin-top:0;
}

.msite-mycontent-container .prod-box:last-child {
    padding-bottom:0rem;
    border-bottom:0;
}

.msite-mycontent-container .prod-box > div {
    word-break:keep-all;
}

.msite-mycontent-container .prod-box > div.prod-thumb {
    text-align: center;
}

.msite-mycontent-container .prod-box > div.prod-thumb > img {
    max-width:100px;
    max-height: 100px;;
}

.msite-mycontent-container .prod-box > div.prod-desc {
    text-align: left;
}

.msite-mycontent-container .prod-box > div.prod-desc > div.p-title {
    text-align: left;
    margin-bottom:0.3rem;
    font-weight: bold;
}

.msite-mycontent-container .prod-box > div.prod-desc > div.p-desc {
    text-align: left;
    font-size:80%;
}

.msite-mycontent-container .prod-box > div.prod-price {
    text-align: right;
    align-self: self-end;
}

.pl {
    display: inline-block;
    font-weight: bold;
    color:white;
    font-size:80%;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid #C93437;
    background-color: #C93437;
    padding: .475rem 1.75rem;
    line-height: 1.5;
    cursor: pointer;
    border-radius: 10px;
}

.msite-mycontent-container .prod-box > div.prod-price > div.p-price{
    color:#C93437;
    text-align: right;
    font-weight: bold;
    margin-bottom:0.3rem;
}

@media only screen and (max-width: 780px) {
    .msite-mycontent-container {
        display:grid;
        gap:1.5rem;
        grid-template-columns: 1fr 1fr;
    }
    

    .msite-mycontent-container .prod-box {
        gap: 0.2rem;
        grid-template-columns: auto;
        grid-template-rows: auto auto auto;
        margin-top: 0;
        flex:1;
        border-bottom:0;
        padding-bottom:0;
        align-items: start;
        width:auto;
        font-size:17px;
    }

    .msite-mycontent-container .prod-box > div.prod-desc > div.p-title {
        text-align: center;
    }

    .msite-mycontent-container .prod-box > div.prod-desc > div.p-desc {
        text-align: center;
    }

    .msite-mycontent-container .prod-box > div.prod-price > div.p-price{
        text-align: center;
        
    }

    .msite-mycontent-container .prod-box > div.prod-price {
        text-align: center;
    }
}

@media only screen and (max-width: 1600px) {
    .msite-mycontent-container {
        font-size: 24px;
    }
}

@media only screen and (max-width: 600px) {
    .msit-container-visitor .subscription-message {
        grid-template-columns: 1fr;
        justify-content: center;
        grid-template-areas: 
            'sbmsg-icon'
            'sbmsg-title'
            'sbmsg-desc'
            'sbmsg-action';
    }

    .msit-container-visitor .subscription-message .sbmsg-icon {
        text-align: center;
        margin-bottom:1rem;
    }
    .msit-container-visitor .subscription-message .sbmsg-title {
        justify-self: center;
        text-align: center;
    }
    .msit-container-visitor .subscription-message .sbmsg-desc {
        text-align: center;
    }
    .msit-container-visitor .subscription-message .sbmsg-action {
        text-align: center;
        justify-self: center;
    }
}

@media only screen and (max-width: 480px) {
    .msite-mycontent-container {
        display:grid;
        gap:1.5rem;
        grid-template-columns: auto;
    }

    .msit-container-visitor .subscription-message {
        padding:1.5rem;
        margin:0.5rem;
    }
}