:root {
    --primary-text-color: #ed5b8a;
    --primary-bg-button:#ed5b8a;
    --primary-text-button: #fff;
    --primary-theme-color: #ed5b8a;
}
.text-theme{
    color: var(--primary-text-color) !important;
}
.cameraContainerMobile{
    position: absolute;
    left: 12px;
    top: 9px;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
}
#galleryModal.modal.fade:not(.in) .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(-100%,0)scale(1);
    transform: translate(-100%,0)scale(1);
}
#galleryModal .modal-dialog.modal-dialog-slideout{
    margin: 0px !important;
    min-height: 100vh !important;
}

 .profile-image-container {
     position: relative;
     display: inline-block;
     margin: 0;
 }
.profile-image {
    display: block;
    width: 100%;
    height: auto;
    z-index: 1;
}
.banned-overlay-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    z-index: 2;
}
.banned-overlay-text {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 0px);
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    padding: 10px 20px;
    border-radius: 5px;
    z-index: 3;
    text-align: center;
    white-space: nowrap;
    background-color: rgb(86 86 86 / 76%) !important
}
.js-button{
    background-color: var(--primary-bg-button) !important;
    color: var(--primary-text-button) !important;
}
.activeMn button{
    background-color: var(--primary-bg-button) !important;
    color: var(--primary-text-button) !important;
    border-radius: 10px !important;
}
.mailBoxMenu{
    background-color: var(--primary-theme-color);
    height: auto;
}
.mailBoxMenu li.mailBoxLi{
    padding: 5px;
}
.btn_outer_submenu{
    border-radius: 10px;
    padding: 13px 10px;
    line-height: 0;
}
.btnpink{
    background-color: var(--primary-bg-button) !important;
    color: var(--primary-text-button) !important;
}
.headerbar{
    background-color: var(--primary-theme-color);
}
.sst-simple-link:hover .result li h4, .result li h5, .registration .heading, .note, .title{
    color: var(--primary-theme-color) !important;
}
.tbl_my_membership th.tmm_heading, nav .submenu li a:hover, .addPhotoHeading, .about_part h3, .success_part h3, .findMatchesForm,
#galleryModal .modal-header, #myLoginModal .modal-footer, #myLoginModal .modal-header, #myotpModal .modal-footer, #myotpModal .modal-header{
    background-color: var(--primary-theme-color) !important;
}
.bg-primary-theme{
    background-color: var(--primary-theme-color) !important;
}
.text-primary-theme{
    color: var(--primary-theme-color) !important;
}
.palnWrapper h3{
    font-size: 22px !important;
}
@media (min-width: 320px) and (max-width: 1024px) {
    section.titleWrapper {
        margin-bottom: 5px;
    }
}
@media screen and (min-width: 310px) and (max-width: 580px) {
    .btn-lg {
        padding: 10px 10px;
    }
}
@media (min-width: 994px) {
    .banned-overlay-text {
        font-size: 14px !important;
    }
}
.mobile-theme-btn{
    border-radius: 10px;
    white-space: normal;
}
@media (pointer:none), (pointer:coarse) {
    .home{
        background: linear-gradient(to bottom, #f76ca6, #f9a56d);
        /*color: #f7f6f6;*/
        min-height: calc(100vh - 100px);
    }
    .registration .form-group{
        color: #566374;
    }
    .primary-bold, .text-primary-theme, .profileInformation h3{
        color: #c4fff5 !important;
    }
    .profileInformation ul, .sst-card{
        background: white;
    }
    .tbl_my_membership td, .featurette-heading, .tableContact td span{
        color: white;
    }
    .note{
        color: white !important;
    }
    .scrollbarMenu{
        background: white;
    }
    @media screen and (min-width: 310px) and (max-width: 580px) {
        .btn_outer_submenu {
            background-color: var(--primary-bg-button);
            color: white;
            border: 1px solid #f9a56d;
        }
        .activeMn .btn_outer_submenu{
            background-color: #880e4f !important;
            border: 1px solid #dd328d;
        }
    }
    @media screen and (min-width: 310px) and (max-width: 480px) {
        .scrollbarMenu {
            box-shadow: none !important;
        }
    }
    @media screen and (min-width: 310px) and (max-width: 480px) {
        .titleWrapper {
            margin-top: 93px;
        }
    }
}