body{
    font-weight: 300;
}

@media screen and (max-width:1366px) {
    .content-grid {
        padding-bottom: 50px;
    }
    .globalContentContainer {
        padding-bottom: 50px; 
    }
}

.globalContentContainer{
    padding-top: 100px;
    padding-bottom: 50px;
    min-height: 100vh;
}

@media screen and (max-width:1294px) {
    .globalContentContainer{
        padding-left: 67px;
    }
}
@media screen and (max-width:680px) {
    .globalContentContainer{
        padding-left: 15px;
    }
}

.alertify-notifier {
    z-index: 11000;
}

.alertify-notifier .ajs-message,
.alertify-notifier .ajs-message.ajs-success {
    text-shadow: none;
    border: none;
    border-radius: 7px;
    opacity: .9;
}

.fi {
    border-radius: 2px;
    box-shadow: 0px 0px 3px 1px rgba(107, 107, 107, 0.53);
    -webkit-box-shadow: 0px 0px 3px 1px rgba(107, 107, 107, 0.53);
    -moz-box-shadow: 0px 0px 3px 1px rgba(107, 107, 107, 0.53);
}

.user-stat .user-stat-text.nation-word {
    margin-top: 8px;
}

a.pixivClickable {
    position: relative;
    display: inline-block;
}

a.pixivClickable:after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

a.pixivClickable object {
    margin-top: 5px;
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
}

.noSelect {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
}

.user-avatar-badge-text,
.user-stat-title,
.user-stat-text {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
}

.ck-editor__editable_inline {
    min-height: 100px;
}

.ck.ck-toolbar {
    border-radius: 15px 15px 0 0 !important;
}

.ck.ck-editor__editable_inline {
    border-radius: 0 0 15px 15px !important;
}

figure.media {
    display: block;
}

figure.media div div iframe {
    border-radius: 15px;
}

figure.media.no-curve div div iframe {
    border-radius: 0;
}

.customContent img {
    border-radius: 15px;
}

.customContent img.no-curve {
    border-radius: 0;
}

p img {
    max-width: 100%;
}

a img {
    max-width: 100%;
}

.text-axopix {
    color: #815bff;
}

.PACCDragdrop .PACCCommandIcon {
    cursor: pointer;
    transition: filter 0.5s;
}

.PACCDragdrop .PACCCommandIcon:hover {
    filter: brightness(1.5)
}

.PACCDragdrop .PACCCommandIcon .xm-tooltip-text {
    font-weight: 100;
}

.pointer {
    cursor: pointer;
}

header.header {
    transition: top 0.5s;
}

.context-menu-option .option-icon {
    width: 15px;
    height: 15px;
    margin-right: 10px;
}

.PACCName .input-group .btn {
    width: auto;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    line-height: 35px;
}

.PACCName .input-group input {
    height: 48px;
}

.album-preview .album-preview-info:hover {
    box-shadow: inset 0 -120px 50px -40px rgb(129 91 255 / 90%);
}

.photo-preview .photo-preview-info {
    background-color: rgba(21, 21, 31, .8);
}

.popup-picture .popup-picture-image-wrap .popup-picture-image {
    height: 100%;
}

figure.popup-picture-image{
    overflow-x: hidden;
}

figure>img {
    object-fit: contain;
}

.content-loader div {
    max-width: 100%;
}

.content-loader .item .content .short-title {
    width: auto;
}

.meta-line+.meta-line {
    margin-left: 15px;
}

.simple-dropdown .reaction-item-dropdown {
    width: 120px;
}

.popup-picture .popup-picture-image-wrap .popup-picture-image img {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.popup-top-button {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background-color: #45437f;
    cursor: pointer;
    position: absolute;
    z-index: 2;
    top: -20px;
    transition: background-color .2s ease-in-out
}

.popup-top-my-reaction {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    width: 20px;
    height: 20px;
    position: absolute;
    z-index: 3;
    top: -30px;
    right: 150px;
}

.popup-top-my-reaction img {
    width: 100%;
}

.popup-top-button svg {
    fill: white;
}

.popup-top-button:hover {
    background-color: #815bff;
}

.popup-close-button {
    right: -20px;
}

.popup-share-button,
.popup-comment-button,
.popup-reaction-button,
.popup-top-my-reaction,
.popup-menu-button {
    display: none;
}

.popup-previous-button,
.popup-next-button,
.popup-favored-button {
    display: flex;
}

.popup-menu-button,
.popup-favored-button {
    right: 40px;
}

.popup-share-button,
.popup-previous-button {
    right: 100px;
}

.popup-comment-button,
.popup-next-button {
    right: 160px;
}

.popup-reaction-button {
    right: 220px;
}

.popup-top-reaction-button {
    position: absolute;
    right: 82px;
    top: 31px;
}

.popup-top-reaction-button .xm-tooltip {
    display: none !important;
}

.post-options .post-option.reaction-options-dropdown-trigger .reaction-option-image {
    width: 30px;
    display: none;
}

.post-options .post-option.reaction-options-dropdown-trigger .post-option-icon {
    display: block;
}

.post-options .post-option.reaction-options-dropdown-trigger.reacted .reaction-option-image {
    display: block;
}

.post-options .post-option.reaction-options-dropdown-trigger.reacted .post-option-icon {
    display: none;
}

.commentTimeago.timeago {
    font-size: 0.8em;
}

.timeago {
    cursor: pointer;
}

.animate__animated.animate__delay {
    animation-delay: attr(data-delay);
}

.comment-text {
    font-size: .85em;
    color: #6a6a6a;
}

.widget-box-scrollable {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.alertify-notifier {
    z-index: 110000;
}

.commentReactionButton {
    display: none;
    width: 20px;
}

#popupPostContent {
    min-height: 30px;
}

.popup-picture .commentForm .form-item {
    margin-right: 28px
}

.popup-picture .commentForm .submitCommentBtn {
    position: absolute;
    display: block;
    top: 37px;
    right: 18px;
    color: #815bff;
    cursor: pointer;
}

.popup-picture .popup-picture-image-wrap {
    background-color: #fff;
}

.commentEditInput {
    font-size: 0.95em !important;
}

.reactionButton.haveReaction {
    width: 20px;
}

.text-yellow {
    color: yellow;
}

.swal2-container {
    z-index: 110000 !important;
}

.post-content .post-content-edit-input:focus {
    border-color: #815bff;
    box-shadow: none;
}

.progress-bar {
    background-color: #815bff;
}

.post-content-edit-input {
    background: #eee;
    border: none;
    border-radius: 12px;
}

.post-content-edit-input:focus {
    background: #eee;
    border: none;
    border-radius: 12px;
}

.picture-item .picture-item-overlay {
    background-color: rgba(129, 91, 255, .7);
}

.viewAllillustrationContainer a {
    color: #878787;
    font-size: 1.1em;
}

.post-content.lh-1d5 p{
    line-height:1.5em;
}

.contentCard {
    background-color: #fff;
    box-shadow: 0 0 40px 0 rgb(94 92 154 / 6%);
    border-radius: 12px;
    padding: 32px 28px;
}

.contentCard.narrow {
    padding: 12px 19px
}
.contentCard.narrow-adapt {
    padding: 12px 45px
}
@media screen and (max-width:574px) {
    .contentCard.narrow-adapt {
        padding: 12px 19px
    }
}


.p-relative{
    position: relative;
}
.p-absolute{
    position: absolute;
}

.fullCommentWidth .post-comment{
    padding-left: 26px;
}

.fullCommentWidth .post-comment .post-comment-text{
    padding-left: 62px;
}

.post-comment-list.fullCommentWidth{
    overflow-y: hidden;
}

.illustrationCommentInputContainer{
    border-bottom: 1px solid #eaeaf5; 
    padding-top:33px !important;
    border-radius:12px 12px 0 0;
}

.illustrationDetailBottomBar{
    
    height: auto;
}

.illustrationDetailBottomBar .postFullDetail .illustrationUploadedDateContainer{
    display: none;
    border-top: 1px solid #eaeaf5;
    padding-top:10px;
}
.illustrationDetailBottomBar .postFullDetail .illustrationUploadedDateContainer div{
    display: inline;
}

@media screen and (max-width:1365px) {
    .illustrationDetailSideBar{
        display: none;
    }
}
@media screen and (min-width:1366px) {
    .illustrationDetailBottomBar {
        display: none;
    }
}

@media screen and (max-width:992px) {
    .illustrationDetailBottomBar .illustrationUploadedDateContainer.mini{
        padding-top: 10px;
    }
    .illustrationDetailBottomBar .illustrationUploadedDateContainer.mini div{
        display: inline;
    }
}

@media screen and (max-width:575px) {
    .illustrationDetailBottomBar .illustrationUploadedDateContainer.mini{
        display: none;
    }
    .illustrationDetailBottomBar .postFullDetail .illustrationUploadedDateContainer{
        display: block;
    }
}
.imageShowScreen {
    height: 500px;
}

.imageShowScreen figure {
    border-radius: 12px;
}

.commentFormContainer a.submitCommentBtn {
    position: absolute;
    left: 100%;
    top: 0;
    margin-left: -30px;
    margin-top: 14px;
    color: #815bff;
    cursor: pointer;
}

.commentFormContainer textarea.commentInput {
    height: auto;
}

.post-content {
    color: #606060;
    font-size: .875rem;
}

.illustrationGrid {
    grid-template-columns: repeat(auto-fit, 18%);
    grid-gap: 10px;
}

.illustrationGrid .photo-preview {
    height: 200px;
}

@media screen and (max-width:1300px) {
    .illustrationGrid {
        grid-template-columns: repeat(auto-fit, 23%);
    }
}

@media screen and (max-width:1000px) {
    .illustrationGrid {
        grid-template-columns: repeat(auto-fit, 30%);
    }
}

@media screen and (max-width:800px) {
    .illustrationGrid {
        grid-template-columns: repeat(auto-fit, 47%);
    }
}

.albumGrid {
    grid-template-columns: repeat(auto-fit, 18%);
}

.albumGrid .album-preview {
    height: 260px;
}

@media screen and (max-width:1100px) {
    .albumGrid {
        grid-template-columns: repeat(auto-fit, 23%);
        grid-gap: 10px;
    }
    .albumGrid .album-preview {
        height: 240px;
    }
}

@media screen and (max-width:850px) {
    .albumGrid {
        grid-template-columns: repeat(auto-fit, 31%);
    }
}

@media screen and (max-width:480px) {
    .albumGrid {
        grid-template-columns: repeat(auto-fit, 48%);
    }
}

.albumPreviewGrid {
    grid-template-columns: repeat(auto-fit, 23%);
}

.albumPreviewGrid .album-preview {
    height: 340px;
}

@media screen and (max-width:1500px) {
    .albumPreviewGrid {
        grid-gap: 10px;
    }
}

@media screen and (max-width:824px) {
    .albumPreviewGrid {
        grid-template-columns: repeat(auto-fit, 48%);
    }
}

.photos-masonry {
    grid-template-areas: unset;
    grid-template-columns: repeat(auto-fit, 23%);
    grid-template-rows: auto;
}

.photos-masonry .photo-preview {
    grid-area: auto !important;
    height: 270px;
}

@media screen and (max-width:1092px) {
    .photos-masonry .photo-preview {
        height: 200px;
    }
}

@media screen and (max-width:823px) {
    .photos-masonry {
        grid-template-columns: repeat(auto-fit, 31%);
        grid-gap: 10px;
    }
}

@media screen and (max-width:680px) {
    .photos-masonry {
        grid-template-columns: repeat(auto-fit, 48%);
    }
}

@media screen and (max-width:404px) {
    .photos-masonry .photo-preview {
        height: 150px;
    }
}

@media screen and (max-width:333px) {
    .photos-masonry {
        grid-gap: 4px;
    }
}

@media screen and (max-width:320px) {
    .photos-masonry .photo-preview {}
}

@media screen and (max-width:1365px) {
    .popup-picture .popup-picture-image-wrap,
    .popup-picture .popup-picture-image-wrap .popup-picture-image img {
        border-radius: 12px;
    }
    .popup-comment-button,
    .popup-reaction-button,
    .popup-top-my-reaction.reacted,
    .popup-menu-button {
        display: flex;
    }
    .popup-previous-button,
    .popup-next-button {
        display: none;
    }
    .popup-favored-button {
        right: 100px;
    }
}

@media screen and (max-width:481px) {
    a.pixivClickable object {
        margin-top: 2px;
    }
}

.simple-dropdown .simple-dropdown-link:hover{
    color: #815bff;
}

.privacyIcon{
    font-size: 0.8rem;
    color: #5b5c76;
}

.button.borderOnly{
    background-color: transparent;
    background: transparent;
    color: #6b6b6b;
    border: 1px solid #dedeea;
    box-shadow:none;
}

p.simple-dropdown-link{
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
}

.switch-option .switch-option-text{
    max-width: 80%;
}

@media screen and (max-width:960px) {
    .switch-option .form-switch {
        position:absolute;
        top:0;
        right:0;
    }
}

.button.samll{
    height:35px;
    line-height: 35px;
}

.text-gray{
    color:#606060;
}

.text-light-gray{
    color:#919191;
}

.border-none{
    border: none !important;
}

.w-90{
    width: 90%;
}

a, h1, h2, h3, h4, h5, h6, p{
    line-height: 1.5em;
}

.button.white:hover{
    color:#fff;
}

.product-preview{
    overflow: hidden;
}

.no-break-line{
    white-space:nowrap;
}

.landing{
    background:url(/img/landing/login-bg.jpg) no-repeat 0;
    background-size:cover;
    background-position: center center ;
    background-attachment: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 100vh;
    padding: 20px 0;
}

.landing .landing-decoration{
    background:url(../img/landing/dot-texture.png) repeat 0 0;
}

.landing-info,.landing-form{
    position: relative;
}


.landing-decoration{
    position: absolute;
}

.landing .logo-container{
    
    -webkit-filter: drop-shadow(0 0 25px rgba(255, 255, 255, 1.5));
    filter: drop-shadow(0 0 25px rgba(255, 255, 255, 1));
}

.landing .logo-container .logo-horizon{
    
    -webkit-filter: drop-shadow(0 0 15px rgba(255, 255, 255, 1.5));
    filter: drop-shadow(0 0 15px rgba(255, 255, 255, 1));
}

.landing .checkbox-wrap input[type=checkbox]:checked+.checkbox-box,.landing .checkbox-wrap input[type=radio]:checked+.checkbox-box{
    background-color:#815bff;
    border-color:#815bff;
}

.landing input{
    background-color: rgba(255,255,255,0.5);
}

.landing input:focus{
    background-image:
    linear-gradient(white, white), 
    linear-gradient(to right, #815bff, #009dff, #65ffcd);
    background-origin:border-box;
    background-clip:padding-box, border-box;
    border: double 1px transparent;
}

.landing input:-webkit-autofill:hover, 
.landing input:-webkit-autofill:focus,
.landing input:-webkit-autofill,
.landing input:-webkit-autofill:hover, 
.landing input:-webkit-autofill:focus,
.landing textarea:-webkit-autofill,
.landing textarea:-webkit-autofill:hover,
.landing textarea:-webkit-autofill:focus,
.landing select:-webkit-autofill,
.landing select:-webkit-autofill:hover,
.landing select:-webkit-autofill:focus {
    -webkit-box-shadow:0 0 0 50px white inset; /* Change the color to your own background color */
    -webkit-text-fill-color: #333;
    border: 1px solid #dedeea;
}

.landing .form-input label{
    font-size:0.8rem;
    top:18px;
    background-color: rgba(255,255,255,.7);
}
.landing .form-input.active label{
    top:-7px;
    text-shadow: 0 0 4px #fff, 0 0 4px #fff, 0 0 4px #fff, 0 0 4px #fff, 0 0 4px #fff, 0 0 4px #fff;
    background-color: transparent;
}

.landing .logo-horizon{
    width: 300px;
}

.landing .login-box,.landing .register-box{
    width: 100%;
    padding: 30px 20px;
}

.landing .login-form{
    min-height: 334px;
}

.landing .contentCard{
    width: 80%;
    max-width: 600px;
    z-index: 2;
    box-shadow: 0 0 60px 0 rgb(94 92 154 / 12%);
    background-color: rgba(255,255,255,.9);
}

@media screen and (max-width:1365px) {
    
    .landing{
        padding: 20px 0;
    }

    .landing .contentCard{
        padding-top:10px;
        padding-bottom: 0;
    }
    @media screen and (min-height:670px) {
        .landing .contentCard{
            margin-top:-100px;
        }
    }
    @media screen and (max-height:560px) {
        .landing{
            display: block;
        }
    }

    .landing .tab-switch-button{
        width:120px;
        height:45px;
        font-size:0.8rem;
        line-height:45px;
    }

    .landing input{
        height: 45px;
        line-height: 45px;
        font-size: 0.8rem;
    }

    .landing .checkbox-wrap label{
        font-size: 0.7rem;
    }

    .landing .form-link{
        font-size: 0.7rem;
    }

    .landing #loginSubmitBtn{
        font-size: 0.75rem;
        height: 45px;
        line-height: 45px;
    }

    .landing .login-form{
        min-height: 300px;
    }
}

@media screen and (max-width:900px) {
    .landing .logo-horizon{
        width: 200px;
    }
}

.commissionDetailContainer .slider-panel .slider-panel-roster .slider-controls:after, .commissionDetailContainer .slider-panel .slider-panel-roster .slider-controls:before{
    content: none;
    width: 0;
    height: 0;
    background-color: #eaeaf5;
    position: absolute;
    top: 0
}

.commissionDetailContainer .slider-panel .slider-panel-roster{
    padding:20px 20px;
    height: auto;
}

.commissionDetailContainer .roster-picture{
    z-index: 1;
}

.commissionDetailContainer .roster-pictures:after,.commissionDetailContainer .roster-pictures:before{
    content: none;
    width: 0;
    height: 0;
    background-color: #eaeaf5;
    position: absolute;
    top: 0
}

.commissionDetailContainer .roster-picture.active:before{
    content: '';
    position: absolute;
    top: -3px; right: -3px; bottom: -3px; left: -3px;
    z-index: -1;
    border-radius: 15px;
    background: linear-gradient(to right, #815bff, #009dff, #65ffcd);
}

.commissionDetailContainer .user-stat.big{
    padding: 0 20px;
}

@media screen and (max-width:1365px) {
    .commissionDetailContainer .slider-panel-roster{
        display: none;
    }
}

#gdpr-cookie-message{
    bottom: 63px;
    z-index:1000;
}

.commissionDetailContainer .basePriceSmall{
    display: none;
}
.commissionDetailContainer .basePriceBig{
    display: block;
}

.commissionDetailContainer .slider-panel .slider-panel-roster
{
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fit, 8%);
    justify-content:center !important;
}
.commissionDetailContainer .productList .productItem.active h6{
    color: #fff;
}
.commissionDetailContainer .productList .productItem .checkIcon{
    display: none;
}

.commissionDetailContainer .productList .productItem.active .checkIcon{
    display: inline;
}

.commissionDetailContainer .productList .productItem.active .uncheckIcon{
    display: none;
}

.commissionDetailContainer .productList .list-group-item-action.active:focus,.commissionDetailContainer .productList .list-group-item-action.active:hover
{
    color: #fff;
}
.commissionDetailContainer .productList .list-group-item{
    transition: all 0.5s;
}
.commissionDetailContainer .productList .list-group-item.active{
    background-color:#815bff;
    border-color:#815bff;
}
.commissionDetailContainer .imageLoaderBg{
    top: 50%;
    margin-top: -42px;
    width: 100%;
    z-index: -1;
}
.commissionDetailContainer .estimateFee.small, .commissionDetailContainer .estimateFeeCurrency.small{
    font-size: 1.5rem;
}

.price-title .currency{
    color:#815bff;
}

@media screen and (max-width:767px) {
    .commissionDetailContainer .slider-panel .slider-panel-roster
    {
        grid-template-columns: repeat(auto-fit, 13%);
    }
    .commissionDetailContainer .imageShowScreen{
        height: 260px;
    }
    .commissionDetailContainer .commissionDescription{
        font-size: 0.9rem;
    }
}

@media screen and (max-width:440px) {
    .commissionDetailContainer .slider-panel .slider-panel-roster
    {
        grid-template-columns: repeat(auto-fit, 20%);
    }
}

@media screen and (max-width:575px) {
    .commissionDetailContainer .policyItem{
        font-size: 0.8rem;
    }
    .commissionDetailContainer .productContentContainer{
        padding-left: 0;
        padding-right: 0;
    }
    .commissionDetailContainer .basePriceBig{
        display: none;
    }
    .commissionDetailContainer .basePriceSmall{
        display: block;
    }
    .commissionDetailContainer .productContentContainer .productName{
        font-size: 1rem;
    }
}



@keyframes backgroundMoveLR {
    0%{background-position:0% 51%}
    50%{background-position:100% 50%}
    100%{background-position:0% 51%}
}


@media screen and (max-width:991px) {
    .commissionOrderCreateContainer .leftCard{
        padding: 0;
    }
    .commissionOrderCreateContainer .rightCard{
        padding: 0;
    }
}

.commissionOrderCreateContainer .creatorName{
    word-break:break-word;
}

.commissionOrderCreateContainer .uploadCommunicationGif, .commissionOrderDetailContainer .uploadCommunicationGif{
    color:#adafca;
}
.commissionOrderCreateContainer .uploadCommunicationGif:hover, .commissionOrderDetailContainer .uploadCommunicationGif:hover{
    color:#3e3f5e;
}

@media screen and (max-width:479px) {
    .commissionOrderCreateContainer .action-request.with-text .action-request-text{
        display: inline;
    }
    .commissionOrderCreateContainer .action-request.with-text{
        width: 100px;
    }

    .commissionOrderCreateContainer #createOrder{
        font-size: 0.7rem;
    }
    .commissionOrderCreateContainer .quick-post .quick-post-footer
    {
        padding:0 10px;
    }
}

@media screen and (max-width:1119px) {
    .commissionOrderCreateContainer .confirmContainer,.commissionOrderCreateContainer .completeContainer .completeMessage{
        font-size: 0.9rem;
    }

    .commissionOrderCreateContainer .confirmContainer .button{
        height:40px;
        line-height: 40px;
    }

    .fs-adjust-small-1119{
        font-size: 0.9rem;
    }
}

.pillButton
{
    font-size: 0.8rem;
    font-weight: 500;
    padding: 8px 20px;
}

.pillButton.pillButtonSmall
{
    font-size: 0.7rem;
    font-weight: 500;
    padding: 6px 13px;
}

.bg-axopix{
    background-color:#815bff !important;
}

.bg-warning{
    background-color: #e9970f!important;
}

.form-switch.form-switch-success.active{
    background-color:#28a745!important;
}

.commissionOrderDetailContainer .communicationContent{
    background-color: #efefef;
    padding: 12px;
    border-radius: 12px;
}

.paymentIcon{
    height: 40px;
    border-radius: 10px;
    float:right;
}

@media screen and (max-width:1119px) {
    .paymentIcon.paymentIcon-xs{
        height: 30px;
        border-radius: 5px;
        margin: 5px 0;
    }
}

@media screen and (max-width:390px) {
    .paymentIcon.paymentIcon-xs{
        height: 24px;
        border-radius: 5px;
        margin: 8px 0;
    }
}

@media screen and (max-width:350px) {
    .paymentIcon.paymentIcon-xs{
        height: 16px;
        border-radius: 5px;
        margin: 12px 0;
    }
}

.paymentOptionText{
    line-height:40px;
}

.gradientFill path {
	fill: url(#gradientLinear);
}

.linear-stop1 {
    stop-color: #7146ff;
}

.linear-stop2 {
    stop-color: #0c97e8;
}

.linear-stop3 {
    stop-color: #43ffd6;
}

.svg-settings {
/* Hiding this content since it's just settings. See - https://snook.ca/archives/html_and_css/hiding-content-for-accessibility */
position: absolute !important;
height: 1px; width: 1px;
overflow: hidden;
clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
clip: rect(1px, 1px, 1px, 1px);
}


.commissionOrderPaymentContainer .paymentForm{
    max-height: 0;
    transition:all 1s;
    opacity: 0;
    overflow: hidden;
}

.commissionOrderPaymentContainer .paymentForm.active{
    opacity: 1;
}

.commissionOrderPaymentContainer .paymentForm.axopayWalletForm.active{
    max-height: 140px;
}
.commissionOrderPaymentContainer .paymentForm.creditForm.active{
    max-height: 430px;
}
.commissionOrderPaymentContainer .paymentForm.thaiQRForm.active{
    max-height: 70px;
}
.commissionOrderPaymentContainer .paymentForm.thaiQRForm.QRGenerated.active{
    max-height: 420px;
}
.commissionOrderPaymentContainer .paymentForm.trueWalletForm.active{
    max-height: 180px;
}
.commissionOrderPaymentContainer .paymentForm.trueWalletForm.processing.active{
    max-height: 650px;
}
.commissionOrderPaymentContainer .paymentForm.rabbitLinePayForm.active{
    max-height: 100px;
}
.commissionOrderPaymentContainer .paymentForm.alipayForm.active{
    max-height: 100px;
}
.commissionOrderPaymentContainer .paymentForm.wechatPayForm.active{
    max-height: 100px;
}
.commissionOrderPaymentContainer .paymentForm.shopeePayForm.active{
    max-height: 100px;
}
.commissionOrderPaymentContainer .paymentForm.atomeForm.active{
    max-height: 100px;
}
.commissionOrderPaymentContainer .paymentForm.visaQRForm.active{
    max-height: 100px;
}

.commissionOrderPaymentContainer .thaiQRCodeImage canvas{
    width: 100% ;
}

.commissionOrderPaymentContainer .paymentOptionList{
    padding: 0 1.25rem;
}

.commissionOrderPaymentContainer .paymentOptionList .paymentOption{
    padding: 0.75rem 0;
}

.commissionOrderPaymentContainer .trueIframeContainer{
    height:450px; 
}

.commissionOrderPaymentContainer #trueIframe{
    overflow: hidden;
    -ms-overflow-style: none; 
    scrollbar-width: none; 
    height: 1000px;
    width: 100%;
    top: -175px; 
}

.commissionOrderPaymentContainer #trueIframe::-webkit-scrollbar { 
    display: none; 
}

@media screen and (max-width:416px) {
    .commissionOrderPaymentContainer #trueIframe{ 
        transform: scale(0.8); 
        top: -246px; 
        left: 0;
    }

    .commissionOrderPaymentContainer .trueIframeContainer{
        height:353px; 
    }
    
}

@media screen and (max-width:369px) {
    .commissionOrderPaymentContainer #trueIframe{ 
        left: -40px;
        width: 350px;
    }
    
}



/*.profile-header .profile-header-info .profile-header-social-links-wrap .slider-controls {
    width: 380px;
}

.profile-header .profile-header-info .profile-header-social-links-wrap {
    width: 425px;
    right: 43px;
    top: 45px;
}

.profile-header-social-links .profile-header-social-link {
    display: flex;
}*/