@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');
#loading {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 1;
    background-color: transparent;
    z-index: 99999;
}
#loading-image {
    z-index: 100;
}
.loading-wrapper {
   min-width: 150px;
    max-width: 150px;
    display: flex;
    min-height: 150px;
    background: #ffffff;
    padding: 15px;
    border-radius: 20px;
    max-height: 150px;
    box-shadow: 0px 0px 8px #b6b7b9;
    position: relative;
    z-index: 99999;
}
div#loading:after {
    content: "";
    background: #000;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9999;
    opacity: 0.5;
}
.loading-wrapper img#loading-image {
    max-width: 80px;
    display: block;
    margin: auto auto;
}

body{
    font-family: 'Lato';
}
.input-password{
    font-size: 1rem;
}
.grey-text{
    color:#4D4D4D;
}
.dark-grey-text{
    color: #333333;
}
.form-group {
    margin-bottom: 5px;
}
.alert.alert-success{
    text-align: center;
    margin-bottom: 0rem;
    padding: 0.5rem 1.25rem;
    margin-top: 1.15rem;
}
.body-bg {
    background: url(../img/bg.png);
    min-height: 100vh;
    background-size: 100%;
    background-repeat: no-repeat;
    /*background-position: center center;*/
    background-position: top;
}
.successful-body-bg{
    min-height: 100vh;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top;
    background-color: #f3ffff;
}
button.btn.right-aligned{
    float: right;border: none;
}
button.btn.right-aligned:hover {
    border: none;
}

button.btn.right-aligned {
    float: right;
    text-transform: capitalize;
    color:#1f8a80;
}
button.btn.right-aligned:focus {
    border: none;
    box-shadow: none;
}
.card{
    border: none;
}
h4.login-heading {
    /*color:#1f8a80;*/
    color:#fff;
    text-align:center;
    text-transform:capitalize;
    font-size:28px;
    font-weight:bold;
}
button.close {
    border: none;
    float:right;
    color:#000;
    display: inline-flex;
    color: #000;
    justify-content: flex-end;
}
button.close:focus {
    border-color: transparent !important;
    outline-color: transparent !important;
}
button.close {
    margin-top: -4px;
    margin-right: -18px;
    opacity: 1;
}
button.close img {
    opacity: 1;
}
.modal-content {
    border-radius: 15px;
}
label.col-form-label {
    text-transform: capitalize;
}
label.col-form-label {
    text-transform: capitalize;
}
input.form-control,input.form-control:focus {
    background: #f2f2f2;
    border: 1px solid #ececec;
    border-radius: 5px;
    outline:none;
    min-height: 46px;
}
a.forgot-link {
    color: #fff;
    float: right;
    text-transform: capitalize;
    text-decoration: underline; 
}
.welocome-page label {
    color: #fff;
}
.captcha-wrapper {
    background: #bbbbbb;
    border-radius: 6px;
    margin-left: 15px;
    width: calc(58.333333% - 15px);
    max-width: calc(58.333333% - 15px);
    min-width: calc(58.333333% - 15px);
}

.captcha-wrapper input {
    width: 24%;
    display: inline-block;
    border: none;
    padding: 0;
    font-size: 24px;
    font-weight: 500;
    height: 38px;
    color: #000; 
}

span.ml-3.mr-3 {
    margin: 0px !important;
    margin: 0px !important;
    font-size: 24px;
    font-weight: 500;
    color: inherit;
}
.captcha-wrapper {
    background: url(../img/captcha_bg.png);
    border-radius: 6px;
    margin-left: 15px;
}
.form-group.row.contact-math-captcha #sum_value {
    font-size: 22px;
    font-weight: bold;
    color:#000;
}
.ml-3.mr-3.question-mark {
    letter-spacing: 5px;
}
#num2 {
    margin-left: 10px;
    margin-right: -8px;
}
#num1 {
   
    margin-right: 10px;
    text-align: right;
}
.captcha-wrapper input {
    font-weight:bold;
    display: inline-block;
    border: none;
    padding: 0;
}

.error_captcha.invalid-feedback {
    margin-left: 15px;
}

span.ml-3.mr-3 {
    font-weight:bold;
    margin: 0px !important;
}

.form-control:disabled, .form-control[readonly] {
    background: transparent;
}
.captcha-wrapper input:focus {
    background: transparent;
    outline: none;
    border: none;
    box-shadow: none;
}
.btn-primary {
    color: #fff;
    background-color: #1f8a80;
    border-color: #1f8a80;
}
.btn-primary:focus,.btn-primary:hover{
    background-color: #1f8a80;
    border-color: #1f8a80;
    box-shadow: none !important;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: #1f8a80;
    border-color: #1f8a80;
}
.login-btn-wrapper button {
    text-align: center;
    min-width: 160px;
   
    display: block;
    font-weight: bold;
    padding: 9px;
    text-transform: capitalize;
    font-size: 18px;
}
.modal-body .login-btn-wrapper button{
 margin: 23px auto;
}
.buttons-wrap {
    display: flex;
    margin: 50px auto;
    justify-content: center;
}
.buttons-wrap button, .buttons-wrap a {
    margin: 0 10px;
}
a.btn.btn-primary.join-piper-link {
    text-decoration: none;
    font-size: 18px;
    min-width: 160px;
    line-height: 1.7;
}
.card h6.center-align {
    width: 57%;
    text-align: center;
    margin: 0 auto;
    line-height: 1.0;
    font-size: 15px;
}

.card h6.center-align-error {
    width: 84%;
    text-align: center;
    margin: 0 auto;
    line-height: 1.0;
    font-size: 15px;
}

a.back-to-login {
    color: #000000;
    margin:0 auto;
    text-align:center;
    text-decoration: underline;
    display: block;
}
.modal-body {
    padding-bottom: 30px;
}
/* welcome page CSS */

.welocome-page {
    min-height: calc(100vh - 50px);
    justify-content: center;
    display: flex;
    align-content: center;
    align-items: center;
        /*background: rgba(0,0,0,0.);*/
}
.welocome-page  img.logo {
    max-width: 180px;
    margin: 0px auto 10px;
    display: block;
}
.welocome-page h2,.success-page h2{
    text-align: center;
    margin: 0 auto;
    font-weight: 700;
}
h3.welcome-page-text {
    text-align: center;
    font-size: 20px;
    max-width: 790px;
    line-height: 1.7;
    margin: 0 auto;
    letter-spacing: 0px;
}
.inline-btn-wrapper.create-pass button.btn.btn-primary {
    min-width: auto;
    font-size: 18px;
}
.inline-btn-wrapper {
    display: block;
    text-align: center;
    margin-top: 40px;
}
.inline-btn-wrapper button.btn.btn-primary {
    font-size: 20px;
    font-weight: bold;
    margin: 0px 10px;
    text-transform:capitalize;
    min-width: 180px;
}
.site-map ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-map ul li {
    display: inline-block;
}

.site-map {
    justify-content: flex-end;
    display: flex;
}
.copy-right-para p {
    margin: 0;
    color:#000000;
}
.fixed-footer {
    position: fixed;
    padding: 12px 35px;
    left: 0;
    right: 0;
    bottom: -1px;
    background: #F5F5F5;
}
.site-map ul li a {
    color: #000000;
    padding: 0 20px;
}
.site-map ul li:last-child a{
    padding-right: 0px;
}

/* Signup screen CSS */
ul#citydatalist {
    position: absolute;
    background: white;
    z-index: 99;
    width: 93%;
    list-style: none;
    margin:0;
    padding: 0px 0px;
    overflow-y: scroll;
    max-height: 150px;
    border: 1px solid #ececec;
    border-radius: 6px;
}
ul#citydatalist li {
    cursor: pointer;
    padding: 5px 15px;
}
ul#citydatalist li:hover{
    background: #f2f2f2;
}
ul#citydatalist::-webkit-scrollbar {
    width: 10px;
    height: 8px;
    background-color: #f2f2f2; /* or add it to the track */
}
ul#citydatalist::-webkit-scrollbar-thumb {
      background: #1f8a80;
}
.back-btn a {
    cursor: pointer;
    padding: 10px 15px;
    vertical-align: middle;
    color: #000;
    font-weight: 500;
}
.col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.back-btn {
    justify-content: flex-end;
    display: flex;
        padding-right: 0;
}
.col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.back-btn a.cross-btn {
    float: revert;
}
.back-btn a img {
    width: 15px;
    margin-right: 0;
    vertical-align: sub;
}
.signup.container {
    /* background: #f3ffff; */
    /*position: fixed;*/
    top: 0;
    bottom: 0;
    left: 30%;
    box-shadow: 3px 0px 10px 0px #797777;
    right: 30%;
    width: 40%;
    max-width: 40%;
}
img.centered-logo {
    max-width: 200px;
    margin: 0 auto;
    display: block;
}
.bg-pink{
    background-color: #1f8a80;
}
.centered-heading {
    text-align: center;
}
.white-text {
    color: #ffffff;
}
h3.centered-heading.white-text {
    padding: 10px;
    font-size: 24px;
    font-weight: bold;
    margin-bottom:0px;
}
.signup-inner {
    padding: 40px 50px;
}

label.black-small-font {
    vertical-align: middle;
}

.signup-inner input.form-control,.signup-inner input.form-control:focus {
    background: #fff;
    min-height: 43px;
}
.form-control:focus {
    border-color: inherit !important;
    outline: none !important;
    box-shadow: none !important;
}
label.black-small-font {
    vertical-align: -webkit-baseline-middle;
    font-weight: bold;
    margin-top: -4px;
    padding: 0;
}
/* .signup.container label.black-small-font{
    vertical-align: text-top;
} */
.margin-top-10{
    margin-top:10px;
}
.margin-top-15{
    margin-top:15px;
}
.margin-top-20{
    margin-top:20px;
}
.margin-top-25{
    margin-top:25px;
}
.margin-top-30{
    margin-top:30px;
}
.margin-top-40{
    margin-top:40px;
}
.signup.container img.centered-logo {
    margin: -120px auto 35px;
    max-width: 150px;
}
label.uploadimageeditprofile {
    position: relative;
    text-transform: capitalize;
    text-decoration: underline;
    text-align: center;
    margin: 0 auto;
    width: 100%;
    max-width: 200px;
    z-index: 9;
    font-size: 14px;
    min-width: 200px
}
.profile-photo-upload img#blah {
    max-width: 200px;
    cursor: pointer;
    max-height: 215px;
    object-fit: cover;
    min-width: 200px;
    min-height: 215px;
}
.profile-photo-upload input {
    position: absolute;
    z-index: 999;
    opacity: 0;
    right: 0;
    top: 0;
    max-width: 200px;
    left: 0px;
    cursor: pointer;
    bottom: 0;
}

p.multiple-photo-text {
    font-size: 13px;
    font-weight: 500;
    text-align: center;
}
input[type=file]#profile_photo+img#blah {
    position: relative;
    max-width:180px;
}
label.multiple-upload {
    position: relative;
    z-index: 9999;
    color: #ffffff;
    background: #1f8a80;
    padding: 5px 18px;
    border-radius: 5px;
    margin-bottom: 5px;
    margin-top:10px;
    cursor: pointer;
}
input.upload-images {
    position: absolute;
    z-index: 1;
    opacity: 0;
    max-width: 210px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 80px;
    cursor: pointer;
}
.signup.container::-webkit-scrollbar {
    width: 10px;
    height: 8px;
    background-color: #fffcf7; /* or add it to the track */
}
.signup.container{
    overflow-x: hidden;
    overflow-y: auto;
    background: #afafaf;
    /* padding-top: 15px; */
} 
.pip {
    display: inline-block;
    position: relative;
}
.pip:nth-child(2n+1) {
    margin-right: 28px;
    margin-bottom: 15px;
}
.mutiple-image-wrapper {
    text-align: center;
}
/* Add a thumb */
.signup.container::-webkit-scrollbar-thumb {
      background: #fffcf7;
}

output#result {
    text-align: center;
    display: block;
    max-width: 350px;
    max-height: 250px;
}
.pip img.imageThumb {
    width: 80px;
    margin-bottom: 5px;
    max-width: 80px;
    height: 80px;
    max-height: 80px;
    object-fit: cover;
    min-width: 80px;
    min-height: 80px;
    margin-bottom: 5px;
}
.pip {
    position: relative;
}
span.remove {
    position: absolute;
    top: -14px;
    right: -6px;
}
 span.remove img {
    max-width: 14px;
    max-height: 15px;
    cursor: pointer;
}
.profile-photo-upload {
    position: relative;
    /*max-width: 180px;*/
}
figure label.cabinet.center-block img {
    min-width: 190px;
    background-color: transparent;
    border: none;
    padding: 0;
}
.output#result img.mpp {
    position: relative;
    max-width:180px;
}
.mpp-wrapper {
    position: relative;
    max-width: 210px;
}
img.mpp {
    max-width: 80px;
    max-height: 80px;
    margin-bottom: 5px;
}
/* The radiobox-container */
.radiobox-container {
    width: 50%;
    float: left;
    display: inline-block;
    position: relative;
    padding-left: 31px;
    margin-bottom: 7px;
    cursor: pointer;
    font-size: 16px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* Hide the browser's default radio button */
.radiobox-container input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
/* Create a custom radio button */
.radiobox-container .checkmark {
    position: absolute;
    top: 5px;
    left: 0;
    height: 16px;
    width: 16px;
    background-color: #fff;
    border-radius: 50%;
    border: 2px solid #b5b5b5;
}
/* On mouse-over, add a grey background color */
.radiobox-container:hover input ~ .checkmark {
    background-color: #ccc;
}
 
/* When the radio button is checked, add a blue background */
.radiobox-container input:checked ~ .checkmark {
    background-color: #fff;
    border: 2px solid #1f8a80;
    border-radius: 50%;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
 /* Show the indicator (dot/circle) when checked */
  .radiobox-container input:checked ~ .checkmark:after {
    display: block;
}
/* Style the indicator (dot/circle) */
.radiobox-container .checkmark:after {
       top: 3px;
       left: 3px;
       width: 6px;
       height: 6px;
       border-radius: 6px;
       background: #1f8a80;
}
.age-group-wrapper label.radiobox-container,.gender-group-wrapper label.radiobox-container{
    margin-bottom: 15px;
}
.back-btn-wrapper button img {
    width: 18px;
    margin-right: 5px;
    vertical-align: sub;
}
.back-btn-wrapper button {
    background: transparent;
    border: none;
    padding:10px 15px;
    vertical-align:middle;
}
.back-btn-wrapper button:focus {
    outline: none;
    text-decoration: underline;   
}
/* The custom-multiselect */
.custom-multiselect,div#locationmodal label.custom-checkbox {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 9px;
    cursor: pointer;
    font-size: 16px;
    text-transform: capitalize;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
div#locationmodal label.custom-checkbox{
     padding-left: 12px !important;
}
input#don_not_show{
    line-height: 1.0 !important;
}
p.info-msg {
    margin-bottom: 0;
}
/* Hide the browser's default checkbox */
.custom-multiselect input,div#locationmodal input{
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
  
/* Create a custom checkbox */
.custom-multiselect .checkmark, div#locationmodal label.custom-checkbox .checkmark{
    position: absolute;
    top: 0;
    left: 0;
    height: 18px;
    width: 18px;
    border-radius: 4px;
    background-color:#ffffff;
    border: 2px solid #b5b5b5;
}
  
/* On mouse-over, add a grey background color */
.custom-multiselect:hover input ~ .checkmark,div#locationmodal label.custom-checkbox:hover input ~ .checkmark{
    background-color:transparent ;
}
  
/* When the checkbox is checked, add a blue background */
.custom-multiselect input:checked ~ .checkmark ,div#locationmodal label.custom-checkbox input:checked ~ .checkmark{
    background-color:#1f8a80;
        border-color: #1f8a80;
}
  
/* Create the checkmark/indicator (hidden when not checked) */
.custom-multiselect .checkmark:after,div#locationmodal label.custom-checkbox .checkmark:after{
    content: "";
    position: absolute;
    display: none;
}
.custom-multiselect .checkmark,div#locationmodal label.custom-checkbox.checkmark{
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
}
/* Show the checkmark when checked */
.custom-multiselect input:checked ~ .checkmark:after,div#locationmodal label.custom-checkbox input:checked ~ .checkmark:after{
    display: block;
}
  
/* Style the checkmark/indicator */
.custom-multiselect .checkmark:after,div#locationmodal .checkmark:after {
    left: 4px;
    top: 0px;
    width: 6px;
    height: 11px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
label.custom-multiselect ,div#locationmodal label.custom-checkbox{
    margin-bottom: 0px;
    line-height: 1.3;
}
.custom-multiselect-wrapper {
    display: flex;
    flex-wrap: wrap;
    /*justify-content: center;*/
    /*height: auto;*/
}
.label-wrapper {
    width: 50%;
    padding-right: 5px;
    margin-bottom: 15px;
}
label.custom-multiselect+button.sub-cat {
    font-size: 13px;
    color: #1f8a80;
    font-weight: 500;
    margin-left: 35px;
    word-break: normal;
    cursor: pointer;
    background: transparent;
    border: none;
    padding: 0;
    text-transform: capitalize;
    position: relative;
}
.popover-body {
    /*max-width: 160px;*/
    max-width: 240px;
}
button.sub-cat:focus {
    outline: none;
}
input.form-control.disabled {
    background: #F5F5F5;
}
.happy_wrapper label.radiobox-container {
    min-height: 52px;
}
.very-small-font{
    font-size:14px;
}
.custom-textarea-wrapper textarea.form-control {
    min-height: 130px;
    height: auto;
}
button.submit-btn {
    text-transform: capitalize;
    font-weight: bold;
    min-width: 130px;
}
.range-slider.grad {
    --progress-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2) inset;
    --progress-flll-shadow: var(--progress-shadow);
    --fill-color: linear-gradient(to right, LightCyan, var(--primary-color));
    --thumb-shadow: 0 0 4px rgba(0, 0, 0, 0.3), -3px 9px 9px rgba(255, 255, 255, 0.33) inset, -1px 3px 2px rgba(255, 255, 255, 0.33) inset, 0 0 0 99px var(--primary-color) inset;
}
.range-slider.grad input:hover {
    --thumb-transform: scale(0);
}
.range-slider.grad input:active {
    --thumb-shadow: inherit;
    --thumb-transform: scale(0);
}
.range-wrap {
    position: relative;
    margin: 0 auto 3rem;
}
.range {
    width: 100%;
}
.bubble {
    background: #1f8a80;

    color: white;
    padding: 4px 12px;
    position: absolute;
    border-radius: 4px;
    left: 50%;
    transform: translateX(-50%);
}
.bubble::after {
    content: "";
    position: absolute;
    width: 2px;
    height: 2px;
    background:  #1f8a80;
    top: -1px;
    left: 50%;
}
.popover-body .radiobox-container {
    width: 100%;
    float: none;
    font-size: 14px;
    margin-bottom: 5px;
    line-height: 1.9;
}
.popover-body .radiobox-container input {
    float: left;
    left: 2px;
    width: 100%;
    z-index: 9999;
    top: 7px;
}
.image-upload {
    max-width: 85px;
    max-height: 95px;
    min-height: 110px;
    position: relative;
    display: inline-block;
    float: left;
    cursor: pointer;
    max-height: 100px;
    min-width: 85px;
    margin-bottom: 6px;
    margin-right: 14px;
}
.image-upload-wrapper img {
    min-width: 75px;
    max-width: 75px;
    float: left;
    display: inline-block;
    min-height: 97px;
}
input#profile_photo_one {
    position: absolute;
    opacity: 0;
    width: 75px;
    left: 0;
    cursor: pointer;
    height: 96px;
}
.image-upload-footer p{
    display: inline
}
.image-upload  input[type=file]{
    display: none;
}
.image-upload label{
    margin-bottom: 0;
}
.image-upload img{
    border: 1px solid #ddd;
    cursor: pointer;
    min-width: 85px;
    object-fit: cover;
    max-width: 85px;
    min-height: 98px;
    max-height: 98px;
}
.profileback .deleteThis{
    position: absolute;
    top: 6px;
    right: 21px;
    padding: 0;
}
.deleteThis span{
    color: #fff
}
.image-upload-footer{
    background:transparent;
    padding:0;
}
.image-upload-footer button{
    padding: 0px 5px;
    border-radius: 100%;
    margin-left: 15px;
}
.image-upload-footer button span,.image-upload-footer p{
    color: #fff ;
}
.image-upload:nth-child(2n) {
    margin-right: 0;
}
button.btn.btn-red.reset img {
    width: 15px;
    position: absolute;
    top: -6px;
    right: 0;
    border: none;
    min-width: 16px;
    min-height: 16px;
    max-height: 16px;
    background: transparent;
}

button.btn.btn-red.resetUpdate img {
    width: 15px;
    position: absolute;
    top: -6px;
    right: 0;
    border: none;
    min-width: 16px;
    min-height: 16px;
    max-height: 16px;
    background: transparent;
}

.image-upload:nth-child(3),.image-upload:nth-child(4) {
    margin-bottom: 0;
    min-height: 103px;
}
/* Range slider CSS */
:root {
    --yellow: #ffd049;
    --light-yellow: #fdf2d2;
    --orange: #ffa929;
    --light-gray: #e3e4e8;
    --gray: #71738b;
    --light-blue: #7a7c93;
    --blue: #34385a;
    --slider-handle-size: 14px;
    --slider-handle-border-radius: 2px;
    --slider-handle-margin-top: -4px;
    --slider-track-height: 6px;
    --slider-track-border-radius: 4px;
}

#wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

#sliderContainer {
    width: 100%;
}

#sliderContainer>div:first-child {
    margin-bottom: 0;
}

.tick-slider-header {
    display: flex;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox; 
    display: -webkit-flex;
    justify-content: space-between;
    margin-bottom: 24px;
}

.tick-slider-header>h5 {
    margin: 0;
    font-size: 18px;
    font-weight: 300;
    color: var(--gray);
}

.tick-slider {
    position: relative;
    width: 100%;
    top: -4px;
}

.tick-slider-value-container {
    /* position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-family: "Hind Madurai", sans-serif;
    font-size: 18px;
    color: var(--gray); */
}
div#weightLabelMin {
    position: absolute;
    bottom: 0px;
    margin-right: 15px;
    color: #000;
    font-size: 0;
}
div#sliderContainer {
    width: 65%;
    display: inline-block;
}

span.min-value {
    font-size: 14px;
    margin-right: 15px;
}
span.max-value {
    font-size: 14px;
    margin-left: 15px;
}
.tick-slider-value {
    position: absolute;
    top: 0;
    font-weight: bold;
    color: #000;
    border-radius: var(--slider-handle-border-radius);
}

.tick-slider-value>div {
    animation: bulge 0.3s ease-out;
    margin-top: 29px;
    font-size: 13px;
}
.tick-slider-value>div {
    position: relative;
}
.tick-slider-value>div:after {
    content: 'Miles';
    right: 5px;
    margin-left: 3px;
    font-size: 14px;
    line-height: 1.3;
}
.tick-slider-value>div:before {content: 'Up to';left: -6px;margin-right: 3px;font-size: 14px;line-height: 1.3;}
.tick-slider-background,
.tick-slider-progress,
.tick-slider-tick-container {
    position: absolute;
    bottom: 5px;
    left: 0;
    height: 2px;
    pointer-events: none;
    border-radius: 5px;
    /*z-index: -1;*/
}

.tick-slider-background {
    width: 100%;
    background-color: var(--light-gray);
}

.tick-slider-progress {
    background-color: #1f8a80;
}

.tick-slider-tick-container {
    width: 100%;
    display: flex;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox; 
    display: -webkit-flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 calc(var(--slider-handle-size) / 2);
}

.tick-slider-tick {
    width: 0px;
    height: 0px;
    top:0;
    border-radius: 50%;
    background-color: white;
}

.tick-slider-label {
    opacity: 0.85;
    transition: opacity 0.1s ease;
}

.tick-slider-label.hidden {
    opacity: 0;
}

@keyframes bulge {
    0% {
        transform: scale(1);
    }

    25% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

input[type="range"] {
    -webkit-appearance: none;
    width: 100%;
    background: transparent;
    outline: none;
    margin: 0px 0;
}
input[type="range"]::-webkit-slider-thumb,input[type="range"]::-moz-slider-thumb{
    -webkit-appearance: none;
    border: none;
}
input[type="range"]:focus {
    outline: none;
}
input[type="range"]::-moz-focus-outer {
    border: 0;
}
input[type="range"]::-webkit-slider-thumb{
    -webkit-appearance: none;
    width: 17px;
    margin-top: -4px;
    height: 17px;
    border-radius: 50px;
    background: #1f8a80;
    cursor: pointer;
    -webkit-transform: scale(1);
    transform: scale(1);
    transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

input[type="range"]:hover::-webkit-slider-thumb,
input[type="range"]:focus::-webkit-slider-thumb{
    transform: scale(1.0);
}
input[type="range"]::-moz-range-thumb{
    -webkit-appearance: none;
    width: 2px;
    height: var(--slider-handle-size);
    background: var(--orange);
    border: none;
    border-radius: var(--slider-handle-border-radius);
    cursor: pointer;
    transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
input[type="range"]:hover::-moz-range-thumb,
input[type="range"]:focus::-moz-range-thumb {
    transform: scale(1.0);
}
input[type="range"]::-webkit-slider-runnable-track {
    width: 100%;
    height: var(--slider-track-height);
    cursor: pointer;
    background: none;
    border-radius: var(--slider-track-border-radius);
}
input[type="range"]::-moz-range-track {
    width: 100%;
    height: var(--slider-track-height);
    cursor: pointer;
    background: none;
    border-radius: var(--slider-track-border-radius);
}
input[type="range"]:focus::-webkit-slider-runnable-track {
    /*background: #1f8a80;*/
}
input[type="range"]:active::-webkit-slider-runnable-track {
    /*background: #1f8a80;*/
}
div#weightLabelMax {
    font-size: 0;
}
div#weightValue {
    color: #212529;
    position: absolute;
    bottom: -31px;
    font-weight: 500;
}
.orange-text{
    color: #1f8a80;
}
/* success page design */
.accept-button-wrapper {
    margin: 0 auto;
    text-align: center;
    display: block;
}
img.accept-button {
    width: 90px;
    margin-bottom: 30px;
}
h3.success-page-text {
    width: 420px;
    margin: 20px auto;
    font-size: 24px;
    text-align: center;
    color: #fafcff;
}
a.primary-link {
    font-size: 20px;
    font-weight: bold;
    margin: 0px 10px;
    text-transform: capitalize;
    min-width: 180px;
    color: #fff;
    background: #1f8a80;
    padding: 10px 20px;
    border-radius:5px;
}
a.primary-link:hover{
    text-decoration:none;
}
.back-btn-wrapper {
    display: flex;
    justify-content: center;
}
.success-page {
    display: flex;
    justify-content: center;
    min-height: 100vh;
    align-items: center;
}
.success-page img.logo{
    max-width: 180px;
    margin: -70px auto 30px;
    display: block;
}
.body-bg,.successful-body-bg{
        background-size: cover;
}
label.uploadimageeditprofile:hover {
    color: #1f8a80;
}
.tick-slider-value:after {
    content: "";
    background:#1f8a80;
    width: 20px;
    height: 20px;
    position: absolute;
    top: 9px;
    left: -8px; /*To fix grey space*/
    border-radius: 20px;
    z-index: 9;
}
.tick-slider-value>div {
    position: absolute;
    min-width: 100px;
    margin-left: -39px;
    text-align: center;
}
input[type="range"] {
    opacity: 0;
    height: 20px;
    top: 7px;
    position: relative;
    z-index: 9999;
    cursor: pointer;
}
.signup-inner {
    padding: 40px 40px;
}

.form-group.row.meter-text-wrapper .input-password {
    font-size: 1rem;
}
.alert.alert-danger {
    text-align: center;
    line-height: 1.3;
}
/* profile page css */
.shown-on-mobile {
    display: none;
}
ul.custom-list {
    margin: 0;
   padding:0;
}
.mobile-header-list {
    display: none;
}
ul.custom-list li {
    display: inline-block;
    /*position: relative;*/
    /*width: calc(50% - 10px);*/
    padding-left:0px;
    list-style: none;
    /*max-width: calc(50% - 10px);*/
}
ul.custom-list{
    position: relative;
    margin-left:15px;
}
ul.custom-list:before {
    position: absolute;
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    left: -15px;
    display: block;
    top: 10px;
    background: #333;
}
.page-headings {
    font-weight: bold;
}
.dark-grey-text{
    color: #333333;
}
.profile-page-inner {
    position: relative;
}
.margin-left-30{
    margin-left:30px;
}
.margin-left-50{
    margin-left:50px;
}
.paddingleft-50{
    padding-left: 50px;
}
header .right-align-wrapper{
    align-items: center;
    display: flex;
    justify-content: flex-end;
}
.header-list ul p {
    margin: 0;
    padding: 0;
    font-size: 16px;
    color: #333333;
    text-transform: capitalize;
}
img.admin-img {
    /*width: 50px;
    margin-left: 8px;
    height: 50px;
    border-radius: 50%;*/
}
.profile-admin p{
    margin:0;
    color:#333333;
    font-size:16px;
}
.header-list ul li a {
    color: #333333;
}
header {
    background: #f3ffff;
    padding: 0px 35px;
    box-shadow: -1px 1px 3px 0px #ddd;
}
img.header-logo {
   /* width: 110px;
    margin: 5px 0px;*/
    width: 85px;
    margin: 15px 0px;
}
.header-list ul {
    list-style: none;
    padding: 0;
    margin:0 10px 0 0;
}
.header-list ul li {
    display: inline-block;
    text-align: center;
    margin-right: 20px;
}
.inner{
    padding: 35px 35px;
}
img.profile-image {
    border: 1px solid #ddd;
    margin: 0 auto 15px;
    /*min-width: 270px;*/
    max-width: 100%;
}
img.profile-image-small {
   /* max-width: 131px;*/
    /*border: 1px solid #ddd;*/
    /*margin-bottom: 25px;*/
}
.other-pics {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
span.green-tag {
    font-size: 14px;
    background: #446c75;
    color: #fff;
    padding: 0px 10px 2px;
    line-height: 1.7;
    vertical-align: middle;
    border-radius: 15px;
}
.row.mail-delete-btn-wrapper {
    position: absolute;
    right:50px;
}
.header-list ul li a img {
    width: 28px;
    max-width: 28px;
}
.row.mail-delete-btn-wrapper a {
    margin-left: 15px;
}
.row.mail-delete-btn-wrapper a img {
    max-width: 32px;
}
/* to hide arrrow */
.profile-admin .dropdown-toggle::after {
    display: none;
}
/* to hide arrrow */
.bold-fonts{
    font-weight: bold;
}
.font-18{
    font-size: 18px;
}
.profile-page-inner .row.page-heading-wrapper {
    /*max-width: calc(100% - 100px);*/
    text-transform: capitalize;
    /*to make edit clicable*/
    max-width: calc(100% - 180px);
}
.profile-page-inner{
    padding-left: 30px;
}
.profile-admin.dropdown a#navbarDropdown.nav-link {
    padding: 0rem;
    margin: 0rem;
    text-transform: capitalize;
    color: #333333;
}
.profile-admin.dropdown a#navbarDropdown.nav-link:hover{
    color:#1f8a80;
}
.profile-admin.dropdown a#navbarDropdown.nav-link+.dropdown-menu.show {
    transform: none !important;
    border: none;
    top: 51px !important;
    box-shadow: 1px -1px 7px 0px #d2d1d1;
    padding: 0 0 0px 0;
    left: unset !important;
    right: 5px !important;
}
.profile-admin.dropdown a#navbarDropdown.nav-link+.dropdown-menu.show a.dropdown-item {
    padding: 6px 10px;
    font-size: 14px;
}
.profile-admin.dropdown a#navbarDropdown.nav-link+.dropdown-menu.show a.dropdown-item:last-child{
    padding-bottom: 12px;
}
.dropdown-item.active, .dropdown-item:active{
    background:#1f8a80;
}
/* Search page css */
.green-color{
    color:#446C74;
}
.green-colored-bg{
    background-color:#446C74;
}
.banner{
    display: block;
    vertical-align: middle;
    padding: 60px 20px;
    text-align: center
}
.search-page-inner{
    padding: 30px 0px;
}
.search-page-inner .width-define-container{
    width: 990px;
    margin: 0 auto;
    
}
.second-section,.fourth-section{
    background-color:#c1e2e2;
    padding-top:30px;
}
.fourth-section {
    padding-bottom: 30px;
}
.third-section{
    padding-top:30px;
}
.center-align {
    text-align: center;
}
.search-page-inner .custom-multiselect-wrapper .label-wrapper {
    width: 33.33%;
    display: inline-block;
    float: left;
}
.search-page-inner .range-slider {
    margin: 30px auto 30px;
    text-align: center;
}
.search-page-inner .custom-multiselect-wrapper {
    padding: 30px 0px;
}
.centerise-btn-wrapper button.btn.btn-primary {
    text-align: center;
    margin: 30px auto;
    display: block;
}
.centerise-btn-wrapper.location-wrapper {
    margin: 30px  auto 0px;
    max-width: 500px;
}
.location-wrapper-inner {
    justify-content: center;
    display: flex;
}
.location-wrapper-inner label.radiobox-container {
    width: auto;
    margin-right: 20px;
}
.search-page-inner {
    background: #f3ffff;
}
/* Message page design CSS */
.message-inner-wrapper {
    width: 100%;
}
.buddies-sidebar-inner {
    display: flex;
    flex-wrap: wrap;
}
span.right-align-button a.search-again {
    font-size: 16px;
    color: #ffffff;
    background: #1f8a80;
    line-height: 1.3;
    border-radius: 4px;
    padding: 6px 15px;
}
span.right-align-button a.search-again img {
    width: 15px;
    vertical-align: middle;
    margin-right: 8px;
    margin-top: -4px;
}
span.right-align-button {
    float: right;
}

span.right-align-button a.filter {
    font-size: 16px;
    color: #ffffff;
    background: #1f8a80;
    line-height: 1.3;
    border-radius: 4px;
    padding: 6px 15px;
}
span.right-align-button a.filter img:first-child {
    width: 17px;
    margin-top: -3px;
    margin-right: 10px;
}

span.right-align-button a.filter img:last-child {
    position: absolute;
    top: -10px;
}

span.right-align-button a.filter {
    position: relative;
}
.green-colored-bg.message-buddies-sidebar .buddies-sidebar-inner {
    margin-top:20px;
}
.message-buddies-sidebar {
    position: fixed;
    bottom: 48px;
    top:116px;
    /*min-height: calc(100vh - (116px + 48px));
    max-height: calc(100vh - (116px + 48px));*/
    padding: 15px 10px 15px 18px;
    width: 30%;
    max-width: 30%;
    scrollbar-width: thin;
    overflow-y: auto;
}
/*/ width /*/
.message-buddies-sidebar::-webkit-scrollbar, .message-match-sec-inner::-webkit-scrollbar {
  width: 8px;
}

/*/ Track /*/
.message-buddies-sidebar::-webkit-scrollbar-track, .message-match-sec-inner::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 10px;
}
 
/*/ Handle /*/
.message-buddies-sidebar::-webkit-scrollbar-thumb, .message-match-sec-inner::-webkit-scrollbar-thumb {
  background: #a9a9a9; 
  border-radius: 10px;
}

.green-colored-bg.message-buddies-sidebar h4.white-text {
    padding-left: 15px;
}

button.message-btn-header,button.mess-btn{
    background: transparent;
    border: none;
    box-shadow: none;
    color: #333;
}
button.message-btn-header:hover,button.mess-btn:hover{
    text-decoration: underline;
}
button.message-btn-header:focus,button.mess-btn:focus{
    outline: none;
}
.m-left-right-0 {
    margin: 0;
}
button.message-btn-header {
    display: block;
}
button.message-btn-header img {
    display: block;
    margin: 0 auto;
    width: 26px;
}
.message-inner-test{
    position: fixed;
    right: 0;
    bottom: 48px;
    /* max-height: calc(100vh - 148px);
    min-height: calc(100vh - 148px); */
    top: 113px;
    width: 300px;
    background: #fff;
    padding: 0px;
    /* height: calc(100vh - 135px); */
    /* overflow-y: auto; */
    box-shadow: -1px 5px 6px 0px #ddd;
}
.filter-inner{
    position: fixed;
    right: 0;
    bottom: 97px;
    /* max-height: calc(100vh - 148px);
    min-height: calc(100vh - 148px); */
    top: 113px;
    width: 300px;
    background: #fff;
    padding: 0px;
    /* height: calc(100vh - 135px); */
    /* overflow-y: auto; */
    /*box-shadow: -1px 5px 6px 0px #ddd;*/
}

.message-inner-test .message-box{
    max-height: calc(100vh - 180px);
    min-height: calc(100vh - 180px);
    height: calc(100vh - 180px);
    overflow-y: auto;
    scrollbar-width: thin;
}
.filter-box{
    max-height: calc(100vh - 258px);
    min-height: 100px;
    height: calc(100vh - 258px);
    overflow-y: auto;
    scrollbar-width: thin;
    padding: 5px 15px;
    background: #fff;
}
h3.green-colored-bg.white-text {
    font-size: 18px;
    padding: 10px 10px 15px 15px;
    line-height: 1.3;
}
button.close-btn,button.close-filter{
    float: right;
    background: transparent;
    border: none;
}
button.close-btn:focus,button.close-filter:focus{
    outline: none;
}
.user-list .img-wrapper {
    max-width: 20%;
    width: 20%;
    flex: 0 0 20%;
}
.user-list .img-wrapper img {
    max-width: 50px;
    border-radius: 110%;
    width: 100%;
    min-width: 50px;
    cursor: pointer;
    max-height: 50px;
    min-height: 50px;
    object-fit: cover;
}
.user-list {
    display: flex;
    flex-wrap: wrap;
    cursor: pointer;
    border-bottom: 1px solid #ddd;
    padding: 10px 15px;
}
.user-list .content-wrapper {
    max-width: 80%;
    width: 80%;
    padding: 0 5px 0px 15px;
    flex: 0 0 80%;
}
h5.user-name {
    font-size: 16px;
    font-weight: bold;
    margin: 0;
    cursor: pointer;
}
h5.user-name span.time {
    font-size: 12px;
    color: #565656;
    float: right;
}
p.user-msg {
    font-size: 14px;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding:0;
    margin-bottom: 5px;
    overflow: hidden;
    transition: .3s ease;
}

.light-grey-bg{
    background-color: #f2f2f2;
}
.filter-box::-webkit-scrollbar {
    width: 8px;
    height: 5px;
    background-color: #ffffff; /* or add it to the track */
}
.filter-box::-webkit-scrollbar-thumb {
    /*background: #446c75;*/
    background:#a9a9a9;
    border-radius: 5px;
}
.filter-box::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 10px;
}
.message-inner-test .message-box::-webkit-scrollbar {
    width: 8px;
    height: 5px;
    background-color: #ffffff; /* or add it to the track */
}

/* Track */
.message-inner-test .message-box::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey; 
  border-radius: 10px;
}
 
.message-inner-test .message-box::-webkit-scrollbar-thumb {
      /*background: #446c75;*/
       background:#a9a9a9;
       border-radius: 5px;
}
.row.search-btn {
    margin: 15px 15px;
}
input.search-box {   
    background:url(../img/search.png) no-repeat 9px 9px #F2F2F2; 
    border: 1px solid #ddd;
    width: 100%;
    border-radius: 15px;
    font-size: 14px;
    color:#4D4D4D;
    padding: 5px 10px 5px 30px;
}
.message-inner-test h3.green-colored-bg.white-text {
    position: absolute;
    left: 0;
    right: 0;
    z-index: 99;
}
.message-inner-test h3.green-colored-bg.white-text {
    position: absolute;
    left: 0;
    right: 0;
}
.message-inner-test .message-box {
    padding-top: 50px;
}
.chat-window h5.green-colored-bg.white-text {
    /* position: absolute; */
    left: 0;
    right: 0;
}
.message-inner-test .message-box {
    padding-top: 50px;
}
.row.search-btn+.user-list {
    border-top: 1px solid #ddd;
}
.user-list:nth-child(1) {
    border-top: 1px solid #ddd;
}
input.search-box:focus {
    outline:none;
}

.chat-box-content::-webkit-scrollbar {
    width: 8px;
    height: 5px;
    background-color: #ffffff; /* or add it to the track */
}
.chat-box-content::-webkit-scrollbar-thumb {
     /* background: #446c75;*/
     background:#a9a9a9;
     border-radius: 5px;
}
.chat-box-content{
    overflow-y: auto;
    max-height: 355px;
    min-height: 355px;
    overflow-x: hidden; /*to hide scroll*/
    scrollbar-width: thin;
}
.chat-window {
    position: fixed;
    width: 300px;
    max-width: 350px;
    background: #ffffff;
    box-shadow: -1px 0px 8px 0px #ddd;
    bottom: 47px;
    right: 305px; 
    /*max-height: 425px;*/
    max-height: 540px;
    /* min-height:400px; */
}
.send-btn-wrapper {
    padding: 8px 10px;
}
button.send-btn {
    margin-left: 0px;
    /*width: 25px;
    max-width: 25px;*/
    background: transparent;
    border: none;
   /* display: inline-block;
    margin-right: 10px;*/
}

button.send-btn img {
    max-width: 28px;
    min-width: 28px;
    width:28px;
    height: 28px;
    min-height: 28px;
    max-height: 28px;
}

button.send-btn:focus {
    outline: none;
}
.send-btn-wrapper input.send-btn:focus {
    outline: none;
}
/*.send-btn-wrapper input.send-btn{
    border: 1px solid #ddd;
    width: calc(100% - 40px);
    border-radius: 15px;
    font-size: 14px;
    color: #4D4D4D;
    padding: 5px 15px;
    background:#ececec;
}*/

.emoji-wysiwyg-editor.send-btn{
    border: 1px solid #ddd;
    width: calc(100% - 40px);
    border-radius: 15px;
    font-size: 14px;
    color: #4D4D4D;
    padding: 5px 15px;
    background:#ececec;
}
.chat-window .green-colored-bg.white-text span.user-chat img {
    width: 35px;
    object-fit: cover;
    height: 35px;
    border-radius: 50%;
    min-width: 35px;
    margin-right: 10px;
    max-width: 35px;
    min-height: 35px;
    max-height: 35px;
    border: 2px solid #e8e8e8;
}
.chat-window .green-colored-bg.white-text {
    padding: 8px 15px;
    font-weight: bold;
    font-size: 16px;
    margin-bottom: 0;
}
.chat-box-content {
    padding: 5px 10px;
    font-size: 14px;
    line-height: 1.3;
}
/*to manage continous string*/
.recive-message .message-container {
    word-break: break-word;
}
.chat-window .green-colored-bg.white-text button.cross-btn img{
    cursor: pointer;
    vertical-align: bottom;
}
.chat-window .green-colored-bg.white-text button.min-max-btn{
    margin: 6px 15px 6px 10px;
    border: none;
    outline: none;
    background: transparent;
    display: inline-block;
    width: 16px;
    height: 16px;
    position:relative;
}
.chat-window .green-colored-bg.white-text button.cross-btn{
    padding: 0;
    margin: 0;
    border: none;
    outline: none;
    background: transparent;
}
.chat-window .green-colored-bg.white-text span.inline-btn-wrapper{
    margin: 0;
    padding: 0;
}
.chat-window .green-colored-bg.white-text button.cross-btn:focus,.chat-window .green-colored-bg.white-text button.min-max-btn:focus{
    outline:none;
}
.chat-window{
    display: none;
}
.sent-message {
    text-align: left;
    margin: 6px 0;
    float: left;
}
.recive-message {
    text-align: right;
    float: right;
    margin: 6px 0;
}
.recive-message .message-container {
    background: #446c74;
    text-align: left;
    color: #ffffff;
    border-bottom-right-radius: 0px;
}
.message-container {
    padding: 4px 10px 6px;
    border-radius: 5px;
    font-size: 14px;
    display: inline-block;
    background: #e4e4e4;
    max-width: 80%;
    border-radius: 5px;
    /*min-width: 140px;*/
    min-width: auto;
}
.recive-message ,.sent-message{
    min-width: 190px;
}
.margin0 {
    margin-bottom: 0;
}
p.message-time {
    font-size: 12px;
}
.message-container {
    position: relative;
    font-size: 16px;
}
.sent-message .message-container:after{
    content:url(../img/grey-left.png);
    left: -8px;
}
.sent-message .message-container {
    border-bottom-left-radius: 0px;
}
.message-container:after {
    position: absolute;
    content: url(../img/greenright.png);
    right: -6px;
    bottom: -4px;
}
button.min-max-btn.collapsed img{
    position: relative;
}
button.min-max-btn.collapsed img:before{
    content: '|';
    color: #fff;
    font-size: 16px;
    position: absolute;
    font-weight: 600;
    left: 11px;
    display: inline;
}
button.min-max-btn:before{
    display: none;
}
.green-colored-bg.white-text {
    display: flex;
    justify-content: space-between;
}
button.min-max-btn {
    position: relative;
}
button.min-max-btn:before {
   /* position: absolute;
    transform: rotate(90deg);
    color: #fff;
    font-size: 17px;
    content: '|';
    font-weight: bold;
    display:block;
    top: -12px;
    left: 7px;*/
}
/*button.min-max-btn:after {
    content: "\f067";
    font-family: 'FontAwesome';
}

button.min-max-btn.collapsed:after {
    content: "\f068";
    font-family: "FontAwesome";
}*/
/* button.min-max-btn.collapsed:after {
    position: absolute;
    color: #fff;
    font-size: 14px;
    content: '';
    font-weight: bold;
    top: -6px;
    display:block;
    border: 1px solid;
    width: 0px;
    height: 13px;
}
button.min-max-btn.collapsed:before,button.min-max-btn:before {
    position: absolute;
    transform: rotate(90deg);
    color: #fff;
    font-size: 15px;
    content: '';
    border-right: 2px solid #fff;
    font-weight: bold;
    display:block;
    top: -15px;
    width: 16px;
    height: 16px;
    left: -1px;
} */
button.min-max-btn:before, button.min-max-btn:after {
    position: absolute;
    content: '';
    background: #fff;
    display: block;
    top: 7px;
    width: 16px;
    height: 1.9px;
    left: 0;
    transition: all ease 0.3s;
}
button.min-max-btn.collapsed:after {
    transform: rotate(90deg);
}
button.message-btn-header.present{
    position: relative;
}
button.message-btn-header.present:after {
    position: absolute;
    width: 10px;
    height: 10px;
    top:0;
    background: #FF7F50;
    display: block;
    border-radius: 5px;
    content:'';
    right: 18px;
}
img.user-grid-img{
    max-width: 115px;
    max-height: 111px;
    min-height: 111px;
    min-width: 115px;
    border-radius: 50%;
    object-fit: cover;
    border:2px solid #fff;
}
.buddies-sidebar-inner .inner-grid.light-green{
    background: #6a9198;   
    position: relative;
    border: 1px solid #fcfcfc;
}
.inner-grid{
    display: block;
    padding: 15px;
    max-height: 260px;
    width: 210px;
    text-align: center;
    border-radius: 10px;
   /* box-shadow:0px 2px 6px 0px #2f2f2f;*/
    min-height: 280px;
    max-width: 210px;
    margin: 0 15px 30px;
    border: 1px solid #ffffff;
}
.inner-grid.light-orange.white-text {
    background: rgba(255,255,255,0.5) ;
    color: #535353;
    
    /* background: #f2f0f6; */
    background-image: linear-gradient(to bottom right,#eceff7, #f5f1f5, #f6f2f6);
   /* box-shadow: 0px 2px 6px 0px #c5c5c5;*/
}
.buddies-sidebar-inner {
    display: flex;
    flex-wrap: wrap;
}
.message-match-sec-inner {
    margin-top: 45px;
    display: flex;
    flex-wrap: wrap;
}
.inner-grid h4 {
    margin: 10px 5px 5px;
    font-size: 20px;
    font-weight: 500;
}
.inner-grid h6 {
    margin-bottom: 3px;
    font-size: 14px;
}
.inner-grid a.categories{
    line-height: 14px !important;
    display: block;
    position: relative;
}
.inner-grid .btn-wrapper a img {
    max-width: 28px;
    min-width: 28px;
    margin: 10px 3px 5px;
}
.message-matches-section {
    width: 70%;
    max-width: 70%;
    padding: 15px 30px;
    left: calc(100% - 70%);
    position: relative;
}
.green-text {
    color: #446c74;
}
/*.inner-grid.light-orange.white-text:nth-child(5n) {
    margin-right: 0;
}*/
/*.inner-grid.light-orange.white-text:nth-child(6n),.inner-grid.light-orange.white-text:first-child {
    margin-left: 0;
}*/
.match-page-wrapper{
    /*min-height: calc(100vh - 165px);
    max-height: calc(100vh - 165px);
    height: calc(100vh - 165px);
    position: fixed;
    top: 116px;
    bottom: 48px;*/
}
.match-page-wrapper .Search-page-inner {
    /*overflow-y: hidden;*/
    /*for design lazy load*/
}
.message-match-sec-inner.matches_list{
    /*min-height: calc(100vh - 180px);
    max-height: calc(100vh - 180px);*/
    /*height: calc(100vh - 250px);*/
    /*max-height: calc(100vh - 230px);
    height: calc(100vh - 230px);*/
    /*overflow-y: auto;*/
}
.message-matches-section.match-page-listing-scroll{
    /*max-height: calc(100vh - 180px);
    height: calc(100vh - 180px);*/
}
/*to manage scroll*/
.message-match-sec-inner.nonShowList{
   /* max-height: calc(100vh - 320px);
    height: calc(100vh - 320px);*/
}
.header-list ul li a:focus{
    outline:none;
}
.message-matches-section::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: #f2f2f2; 
    /* or add it to the track */
}
.message-matches-section::-webkit-scrollbar-thumb {
      background: #ddd;
}
.location-modal-wrapper {
    max-width: 80%;
    margin: 30px auto;
    text-align: center;
    display: block;
}

.location-modal-wrapper button.close {
    position: absolute;
    top: 25px;
    right: 40px;
}

.location-modal-wrapper h5.black-small-font {
    text-align: center;
    display: block;
}
.location-modal-wrapper h5.black-small-font {
    display: block;
    text-align: center;
    margin: 0 auto 3px;
    font-weight: 500;
}

.location-modal-wrapper h5.black-small-font-change-email {
    display: block;
    text-align: center;
    margin: 0 auto 3px;
    font-size: 1.45rem !important;
}

.location-modal-wrapper .row.yes-no-btn-wrapper {
    margin: 20px auto;
    display: block;
}

.location-modal-wrapper .row.yes-no-btn-wrapper button.btn.btn-primary {
    margin: 0 10px;
    text-transform: capitalize;
    min-width: 80px;
    font-weight: bold;
}
.location-modal-wrapper .row.yes-no-btn-wrapper+.row {
    text-align:center;
    display:block;
    margin:0 auto;
}
.location-modal-wrapper .row.yes-no-btn-wrapper+.row {
    max-width: 310px;
    margin: 0 auto;
}
.grey-bg-heading {
    background: #f5f5f5;
    padding: 5px;
    text-align: center;
    text-transform: capitalize;
}
.grey-bg-heading h5.black-text {
    margin: 2px;
    font-size: 16px;
    font-weight: bold;
}
div#filter-box div#sliderContainer {
    width: 50%;
}
.filter-box .custom-multiselect-wrapper label.custom-multiselect {padding-left: 22px;font-size: 14px;}

.filter-box .custom-multiselect-wrapper .custom-multiselect .checkmark:after {
    left: 3px;
    top: -1px;
}

.filter-box .custom-multiselect-wrapper .custom-multiselect .checkmark {
    width: 16px;
    height: 16px;
}
.filter-box .tick-slider-value>div:before,.filter-box .tick-slider-value>div:after,.filter-box .tick-slider-value>div{
    font-size: 13px;
}

.filter-box .range-slider span.min-value {
    font-size: 13px;
    margin-right: 10px;
}

.filter-box .range-slider span.max-value {
    font-size: 13px;
    margin-left: 5px;
}
.apply-close-btn {
    display: flex;
    flex-wrap: wrap;
}

.apply-close-btn button,.apply-close-btn a.clear-filter-btn{
    width: 50%;
    font-weight: bold;
    border: none;
    padding: 10px;
    background: transparent;
}

.apply-close-btn button.apply-btn {
    background: #1f8a80;
    color: #ffffff;
}

.apply-close-btn a.clear-filter-btn {
    background: #f2f2f2;
    color: #333333;
    text-align:center;
}

.apply-close-btn button:focus,.apply-close-btn button:hover {
    outline: none;
    text-decoration: underline;
}
input#name {
    text-transform: capitalize;
}
a.other-user-btn {
    padding: 1px 15px;
    border: 2px solid #1f8a80;
    color: #1f8a80;
    text-transform: capitalize;
    border-radius: 17px;
}
.signup.container.edit_profile_wrapper {
    top: 115px;
    z-index: 1;
    background: #f3ffff;
    box-shadow: 1px 3px 6px 1px #797777;
}
/*to manage design of 4 image upload*/
.multiple-photo-upload {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.signup.container.edit_profile_wrapper .multiple-photo-upload {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}
.signup.container.edit_profile_wrapper .signup-inner {
    /*padding-top: 20px;*/
     /*for scroll outside too*/
    padding-top: 110px;
}
.signup.container.edit_profile_wrapper .signup-inner.contact-inner{
    padding-top: 0px;
}
.signup.container.edit_profile_wrapper.about-page-after-login.contact-after-login {
    padding-top: 140px;
}

.signup.container.edit_profile_wrapper h4.centered-heading.green-text.font-bold {
    font-size: 22px;
    padding-top: 10px;
}
.alert.alert-danger {
    margin-top: 10px !important;
}
.profile-page-inner .alert.alert-success {
    margin-bottom: 10px;
    margin-top: 0;
}
/*non-match page design*/
.profile-page-wrapper.non-show-inner .message-matches-section {
    /*min-height: auto;
    max-height: 100%;*/
    /*for scroll manage*/
   /* max-height: calc(100vh - 250px);
    height: calc(100vh - 250px);
    min-height: calc(100vh - 250px);
    overflow-y: hidden;*/
    /*for scroll manage*/
}
.profile-page-wrapper.non-show-inner .message-matches-section {
    width: 100%;
    max-width: 100%;
    padding: 0;
    left:0;
}
/*.profile-page-wrapper.non-show-inner .inner-grid.light-orange.white-text:first-child{
      margin: 0 15px 30px;
}*/
/*.profile-page-wrapper.non-show-inner .inner-grid.light-orange.white-text:nth-child(6n){
        margin: 0 15px 30px;
}*/
/*.profile-page-wrapper.non-show-inner .message-matches-section .inner-grid.light-orange.white-text:nth-child(5n) {
        margin: 0 15px 30px;
}*/
.message-matches-section h4.green-text {
    padding-left: 45px;
}
.profile-page-wrapper.non-show-inner .message-match-sec-inner{
    margin-left:-15px;
}
.inner-grid a.restore-btn{
    color: #fff;
}
a.restore-btn {
    color: #fff;
    background: #1f8a80;
    padding: 2px 8px 5px;
    border-radius: 6px;
    /*text-transform: capitalize;*/
}
.profile-page-wrapper.non-show-inner .message-matches-section .inner-grid.light-orange.white-text .btn-wrapper {
    margin-top: 10px;
}
.about-page-after-login p {
    text-align: justify;
}
.font-bold {
    font-weight: 600;
}
.signup-inner.contact-inner {
    width: 70%;
    margin: 0 auto;
}

.signup-inner.contact-inner input#num1,.signup-inner.contact-inner input#num2 {
    background: transparent;
}
.signup-inner.contact-inner textarea#contact_message {
    padding-left: 10px;
    min-height: 125px;
    max-height: 125px;
    overflow-y: auto;
}
.signup-inner.contact-inner textarea::-webkit-scrollbar {
    width: 10px;
    height: 8px;
    background-color: #f2f2f2; /* or add it to the track */
}
.signup-inner.contact-inner textarea::-webkit-scrollbar-thumb {
      background: #1f8a80;
}
.centerise-content {
    justify-content: center;
    display: flex;
    margin-top: 30px;
}
.signup.container.edit_profile_wrapper .signup-inner .form-group.row {
    margin-top: 20px;
}
.signup-inner.contact-inner button.btn.submit-btn {
    background: #1f8a80;
    color: #fff;
    font-size: 18px;
    min-width: 160px;
}
.signup-inner.contact-inner button.btn.submit-btn:focus, .signup-inner.contact-inner button.btn.submit-btn:hover {
    outline: none;
    text-decoration: underline;
}
h6.grey-text.sub-tag span.gender {
    text-transform: capitalize;
}
/*To maintain scroll*/
body {
    /*overflow: auto;*/
}
.Search-page-inner,.profile-page-wrapper{
    /*overflow-y: auto;
    max-height: calc(100vh - 150px);*/
}
.Search-page-inner::-webkit-scrollbar,.profile-page-wrapper::-webkit-scrollbar{
    width: 10px;
    height: 8px;
    background-color: #f2f2f2; /* or add it to the track */
}
.Search-page-inner::-webkit-scrollbar-thumb,.profile-page-wrapper::-webkit-scrollbar-thumb{
      background: #ffffff;
}
.inner-grid a {
    color: inherit;
    cursor: pointer;
}
.inner-grid a {
    color: inherit;
}
/*custom tooltip*/
/*.shown-on_hover {
    display: none;
}
a.categories {
    white-space: nowrap;
    width: 190px;
    max-width: 190px;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    text-overflow: ellipsis;
}
.inner-grid a.categories:hover{
    overflow: visible;
}
.inner-grid a.categories:hover .shown-on_hover {
    line-height: 14px !important;
    display: block;
    font-size: 13px;
    background: #ffffff;
    width: 190px;
    padding: 10px;
    word-wrap: break-word;
  
    font-size: 14px;
    display: block;
     position: absolute;
}
.shown-on_hover {
    position: absolute;
    line-height: 14px !important;
    display: block;
    font-size: 20px;
    background: #ffffff;
    width: 190px;
    padding: 10px;
    word-wrap: break-word;
   
    font-size: 14px;
    display: block;
}*/

h6.categories span.read-more {
    margin-left: 5px;
    font-weight: bold;
    color: #1f8a80;
    margin-bottom: 5px;
}
h6.categories {
    cursor: pointer;
    position: relative;
}
span.read-more:hover + .tooltip {
    visibility: visible;
    transition: opacity 0.5s ease;
    opacity: 1;
}
.tooltip {
  width: 210px;
  margin-top: 5px;
  visibility: hidden;
  background-color: #fff;
  padding: 5px 15px;;
  -webkit-box-shadow: 0 0 5px 0 rgb(0 0 0 / 30%);
  opacity: 0;
  font-size: 13px;
  font-family: inherit;
  transition: opacity 0.5s ease;
  font-family: inherit;
}
.inner-grid.light-green.white-text span.read-more:hover + .tooltip {
    color: #333;
    font-size: 13px;
    line-height: 1.3;
}
/*no data centerise div*/
.no-data {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    width: 100%;
    min-height: calc(100vh - 285px);
    height: 100%;
    flex-direction: column;
}
.no-data .alert-danger.no_buddies {
    background: transparent;
    color: #ffffff;
    font-weight: bold;
    border: 2px solid;
     padding:5px 10px;
}
.inner-grid h6.categories {
    min-height: 32px;
}
.no-data .alert-danger.no_matches{
     background: #fff;
     color: #1f8a80;
     font-weight: bold;
     border: 2px solid;
      padding:5px 10px;
      margin-bottom: 10px;
}
.message-match-sec-inner .no-data .alert-danger.no_buddies {
    color: #1f8a80;
    padding:5px 10px;
}
div#locationmodal label.custom-checkbox{
    line-height: 1.0 !important;
    text-transform: none !important;
}
/*To show the name with trim*/
 .inner-grid a img+h4 {
    max-width: 170px;
    white-space: nowrap;
    width: 170px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
}
/*Customise tooltip design*/
.customise_tooltip {
  position: relative;
  display: inline-block;
}
.header-list ul li .customise_tooltip .customise_tooltiptext{
    top: 56px;
    padding: 6px !important;
    min-height: 26px;
    box-shadow: 1px 1px 7px 3px #ddd;
    z-index: 999999; /*For edit profile page dashboard header tooltip shown*/
}
.header-list ul li .customise_tooltiptext::after{
    top: -4px;
    bottom: unset;
    border-width: 5px;
    box-shadow: -1px -1px 0px 0px #ddd;
}
.customise_tooltip .customise_tooltiptext {
  visibility: hidden;
  padding: 10px 12px !important;
  line-height: 1.0;
  width: 120px;
  background-color: #ffffff;
  color: #333333;
  text-align: center;
  border-radius: 6px;
  padding: 5px 10px;
  position: absolute;
  z-index: 1;
  bottom: 43px;
  font-size: 14px;
  left: 50%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.3s;
  box-shadow: 1px -1px 2px 0px #aeb0b1;
  /*box-shadow: 1px 1px 7px 3px #ddd;*/
}
.customise_tooltip .customise_tooltiptext::after {
  content: "";
  position: absolute;
  transform: rotate(45deg);
  top: unset;
  bottom: -6px;
  left: 50%;
  margin-left: -5px;
  border-width: 7px;
  border-style: solid;
  box-shadow: 1px 2px 1px 0px #446c74;
  /*box-shadow: -1px -1px 0px 0px #ddd;*/
  border-color: #ffffff;
}
.customise_tooltip:hover .customise_tooltiptext {
  visibility: visible;
  opacity: 1;
}
/*profile page wrapper tooltip*/
.row.mail-delete-btn-wrapper span.customise_tooltiptext{
    bottom: -40px;
    padding: 8px !important;
    width: 110px;
    box-shadow: 1px 1px 5px 0px #aeb0b1;
}
.profile-page-wrapper a.cancel-btn.customise_tooltip.edit-tooltip span.customise_tooltiptext{
    bottom: -36px;
    padding: 8px !important;
    width: 100px;
    box-shadow: 1px 1px 5px 0px #aeb0b1;
}
.profile-page-wrapper a.cancel-btn.customise_tooltip.edit-tooltip span.customise_tooltiptext::after,
.row.mail-delete-btn-wrapper span.customise_tooltiptext::after{
    top: -5px;
    bottom: unset;
    box-shadow: -2px -1px 2px 0px #e2e2e2;
}
.inner-grid.light-orange.white-text span.customise_tooltiptext {
    box-shadow: 0px 0px 1px 1px #ddd;
}
.inner-grid.light-orange.white-text span.customise_tooltiptext::after {box-shadow: 1px 1px 0px 0px #ddd;}
.row.mail-delete-btn-wrapper a.mov-match.cancel-btn.customise_tooltip.cancel-tooltip span.customise_tooltiptext {
    bottom: -53px;
}
/*Customise tooltip design*/
/*To decrease the size of filter range slider*/
.filter-box .tick-slider-value:after {
    content: "";
    background: #1f8a80;
    width: 18px;
    height: 18px;
    position: absolute;
    top: 10px;
    left: -8px;
    border-radius: 50%;
    z-index: 9;
}
/*To decrease the size of filter range slider*/
.fa-smile-o:before {
    content: "\f118";
    font-size: 31px;
}
.emoji-wysiwyg-editor{
    min-height:95px !important;
}
.emoji-wysiwyg-editor.send-btn:focus-visible {
    outline: none;
}
p.user-msg {
    clear: both;
}
.emoji-wysiwyg-editor:empty:before {
    line-height: 1.5;
}
i.emoji-picker-icon.emoji-picker.fa.fa-smile-o {
    display: block;
    height: 9px;
    background: transparent;
    margin-top: 3px;
    margin-bottom: 10px;
    margin-right: -3px;
}
button#btnSend {
    margin-top: 40px;
}
.emoji-items-wrap1 .emoji-menu-tabs {
    border-bottom: 1px solid  #1f8a80;
}
.emoji-picker-icon.parent-has-scroll{
    right: 17px !important;
}
.emoji-items-wrap.mobile_scrollable_wrap::-webkit-scrollbar {
    width: 5px;
    height: 8px;
    background-color: #f2f2f2; /* or add it to the track */
}

body::-webkit-scrollbar{
    width:15px;
    /*height: 8px;*/
    background-color: #f2f2f2; /* or add it to the track */
}
body::-webkit-scrollbar-thumb {
      background: #dddddd;
      height: 10px;
}
.emoji-items-wrap.mobile_scrollable_wrap::-webkit-scrollbar-thumb {
      background: #1f8a80;
}
.emoji-menu {
    bottom: 40px;
}
p.lead.emoji-picker-container {
    display: flex;
}
/*.emoji-wysiwyg-editor.parent-has-scroll {
    cursor: auto !important;
    height: auto !important;
}
.emoji-wysiwyg-editor.send-btn.parent-has-scroll {
    overflow: auto; !important;
}
.emoji-wysiwyg-editor.send-btn {
    max-height: 70px;
    min-height: 70px;
    height: 70px !important;
}
.emoji-wysiwyg-editor.send-btn::-webkit-scrollbar{
    width: 5px;
    height: 8px;
    border-radius: 10px;
    background-color:#f0f0f0;
}
.emoji-wysiwyg-editor.send-btn::-webkit-scrollbar-track {
    border-radius: 10px;
}
.emoji-wysiwyg-editor.send-btn::-webkit-scrollbar-thumb {
      background: #f2f2f2;
      border-radius: 10px;
}*/
button.mute-btn, button.unmute-btn, button.add-group-btn  {
    border: none;
    background: transparent;
    padding: 0;
    margin: 0;
    cursor: pointer;
    margin-right:8px;
    margin-left: 5px;   
}
button.unmute-btn img,button.mute-btn img, button.add-group-btn img{
    width: 22px;
    height: 22px;
    cursor: pointer;
}

button.unmute-btn:focus,button.mute-btn:focus,button.add-group-btn:focus {
    outline: none;
}
h5.user-name span.user-span {
    width: 60%;
    max-width: 60%;
    /*float: left;*/
    word-break: break-word;
    padding-right: 5px;
    line-height: 1.3;
}
h5.user-name span.time {
    width: 40%;
    max-width: 40%;
    vertical-align: middle;
    text-align: right;
    margin-top: 5px;
}
h5.user-name {
    clear: both;
}
/*tooltip for mute and unmute button*/
button.unmute-btn.customise_tooltip span.customise_tooltiptext,button.mute-btn.customise_tooltip span.customise_tooltiptext{
    bottom: -45px;
    top: unset;
    width: 110px;
    font-size: 13px;
    padding: 10px!important;
}

button.unmute-btn.customise_tooltip span.customise_tooltiptext::after,button.mute-btn.customise_tooltip span.customise_tooltiptext::after{
    top: -7px;
    bottom: unset;
    box-shadow: -1px -1px 0px 0px #ddd;
}
.emoji-wysiwyg-editor.send-btn{
    padding-right: 20px;
}
/*collapse button-ttoltip*/
button.min-max-btn.customise_tooltip:hover span.customise_tooltiptext.min {
    visibility: visible;
    opacity: 1;
    z-index: 999;
}
button.min-max-btn.customise_tooltip:hover span.customise_tooltiptext.max{
    visibility: hidden;
}
button.min-max-btn.customise_tooltip.collapsed:hover button.min-max-btn.customise_tooltip.collapsed{
     visibility: hidden;
}
button.min-max-btn.customise_tooltip.collapsed:hover span.customise_tooltiptext.max{
    visibility: visible;
    opacity: 1;
    z-index: 999;
}
span.customise_tooltiptext.min,span.customise_tooltiptext.max {
    box-shadow: 0px 0px 1px 1px #ddd;
}

span.customise_tooltiptext.min::after,span.customise_tooltiptext.max::after {
    box-shadow: 1px 1px 0px 0px #ddd;
}
img.admin-img {
    object-fit: cover;
    background: #827f7b;
    max-width: 50px;
    margin-left: 8px;
    height: 50px;
    border-radius: 50px;
    width: 50px;
}
/*to manage user name on header with trim*/
span.user-name {
    text-align: right;
    max-width: 120px;
    white-space: nowrap;
    width: 120px;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
    display: inline-block;
}
span#chatBoxUserName {
    max-width: 160px;
    white-space: nowrap;
    width: 160px;
    vertical-align: middle;
    overflow: hidden;
    text-transform: capitalize;
    text-overflow: ellipsis;
    display: inline-block;
}
div#chatInner .emoji-menu .emoji-items{
    padding-right: 0px !important;
}
div#chatInner .emoji-wysiwyg-editor::-webkit-scrollbar{
    width: 5px;
    height: 8px;
    border-radius:30px;
    background-color: #f2f2f2; /* or add it to the track */
}
div#chatInner .emoji-wysiwyg-editor::-webkit-scrollbar-thumb{
      background: #f2f2f2;
      border-radius:30px;
}
.emoji-wysiwyg-editor, .conversationMessageBox, .conversationUserListBox,p.user-msg{
    font-family: Lato,Segoe UI emoji !important;
}

a.location-page-info {
    font-size: 16px;
    color: #ffffff;
    background: #1f8a80;
    line-height: 1.3;
    border-radius: 4px;
    padding: 6px 15px;
}
span.customise_tooltiptext.location-tooltip {padding: 5px 0px !important;line-height: 1.0;}
.welocome-page.location-page .align-items-center img {
    max-width: 150px;
    margin: 40px auto 10px;
    display: block;
}
.location-page .row.content-wrapper {
    max-width: 60%;
    margin: 0 auto;
    background: rgba(255,255,255,0.2);
    padding: 20px 30px 30px;
}
.location-page .inline-btn-wrapper.continue-btn a.location-page-info {
    padding: 10px 35px 12px;
    line-height: 1.7;
    font-size: 18px;
    font-weight: bold;
}
.location-page .row.content-wrapper h3.welcome-page-text {
    line-height: 1.5;
    margin-bottom: 15px;
}
div#locationInfo h5.black-small-font:first-child {
    margin-bottom: 15px;
}
span.message-success.alert.alert-success strong{
    text-align:center;
}
div#myModalchangePassword input#password-new-confirm {
    padding: 0.7rem 1rem;
}
span#alert_success {
    display: block;
    margin-top: 0;
}
.message-error.alert.alert-danger.change-password-err{
    margin-top: 10px;
    display: block;
    text-align: center;
}
.alert.alert-danger.change-password-err {
    text-align: center;
    margin-top: 0px;
    display: block;
}
.signup.container.edit_profile_wrapper.about-page-after-login form.contact_form_submit span.error_contact_captcha.invalid-feedback {
    margin-left: 15px;
}
.signup.container.edit_profile_wrapper.about-page-after-login .alert.alert-success {
    display: block;
    width: auto;
    max-width: max-content;
    margin: 0 auto;
}
a.home-link {
    color: #1f8a80;
    border: 2px solid;
    padding: 3px 15px;
    text-transform: capitalize;
    border-radius: 3px;
}
/*multiselect design on sub category*/
.popover-body .custom-multiselect input:checked ~ .checkmark, .popover-body  label.custom-checkbox input:checked ~ .checkmark{
    width: 15px;
    height: 15px;
}
.popover-body .label-wrapper {
    width: 100%;
    margin-bottom: 0px;
}
.popover-body .label-wrapper label.custom-multiselect {
    font-size: 14px;
    padding-left: 28px;
    line-height: 1.2;
    margin-bottom: 5px;
    text-transform: unset !important;
}
.popover-body .custom-multiselect .checkmark:after {
    left: 3px;
    width: 5px;
    top: -1px;
}
.popover-body .custom-multiselect .checkmark {
    width: 16px;
    height: 16px;
}
.popover-body .custom-multiselect {
    padding-left: 28px;
    font-size: 14px;
    margin: 10px 0px;
}
/*multiselect design on sub category*/
.t_and_c ul.custom-list li {
    width: 100%;
    display: block;
    margin-bottom: 15px;
    max-width: calc(100% - 0px);
}
.story-page,.t_and_c,.guidelines,.story-page{
    padding-bottom: 50px;
}
.copy-right-para p {
    text-align: left;
}
img.story-img-1,img.story-img-2{
      max-width: 280px;
    margin: 8px;
}
.story-img-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 20px 0px;
    flex-direction: column;
    max-height: 650px;
}
img.story-img-3 {
    max-width: 326px;
    margin: 8px;
}
form.change_password_submit input#password-confirm {
    padding: 11px 16px;
}
/*for edit profile page*/
.signup.container.edit_profile_wrapper form.profile_update_submit label.custom-multiselect+button.sub-cat {
    text-align: left;
    line-height: 1.3;
}
ul.grey-text.font-16.custom-list.hobbies-list li {
    display:contents;
    line-height: 1.3;
    margin-bottom: 0px;
    font-weight: bold;
}
ul.sub-cat-list {
    padding-left: 6px;
}

ul.grey-text.font-16.custom-list.hobbies-list li ul.sub-cat-list li {
    font-size: 16px;
    line-height: 1.7;
    margin-bottom: 0px;
    padding-left: 0px;
    font-weight: 500;
}
ul.sub-cat-list {
    display: inline-block;
}
ul.grey-text.font-16.custom-list.hobbies-list li ul.sub-cat-list li::before {
    /*border: 1px solid #888;
    background: #ddd;*/
    display: none;
}
.profile-page-wrapper.non-show-inner .message-matches-section h4.green-text {
    padding-left: 0;
}
button.btn.btn-primary.submit-reset+a.back-to-login {
    max-width: 100px;
}
/*signup page tooltip*/
span.customise_tooltiptext.yourself {
    visibility: hidden;
    font-size: 12px;
    line-height: 1.3;
    background: #fff;
}
a.customise_tooltip.img-btn img {
    width: 14px;
    margin: 0;
    vertical-align: middle;
}
span.customise_tooltiptext.yourself{
    padding: 10px 12px !important;
    line-height: 1.0;
    /*width: 300px;*/
    background-color: #ffffff;
    color: #333333;
    font-weight: 400;
    text-align: justify;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    /*bottom: -70px;*/
    font-size: 14px;
    left: 25px;
    opacity: 0;
    line-height: 1.3;
    transition: opacity 0.3s;
    margin-left: 0;
    box-shadow: 0px 0px 2px 0px #aeb0b1;
}
a.customise_tooltip.img-btn {
    max-width: 22px;
    max-height: 22px;
    width: 22px;
    height: 22px;
    margin-left: 5px;
}
a.customise_tooltip.img-btn:hover+span.customise_tooltiptext.yourself {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.3s;
}
span.customise_tooltiptext.yourself::after{
    content: "";
    position: absolute;
    transform: rotate(45deg);
    top: unset;
    bottom: unset;
    top: -6px;
    left: 72px;
    margin-left: -5px;
    border-width: 7px;
    border-style: solid;
    box-shadow: -1px -1px 0px 0px #ddd;
    border-color: #ffffff;
}
span.customise_tooltiptext.yourself.photo {
    top: 32px;
    bottom: unset;
}
a.customise_tooltip.img-btn:focus-visible {
    outline: none;
}
.row.mail-delete-btn-wrapper a.right-btn.customise_tooltip.buddy-tooltip span.customise_tooltiptext {
    width: 120px;
}
/*to manage scroll*/
.profile-page-wrapper.non-show-inner {
   /* height: calc(100vh - 150px);
    overflow-y: hidden;*/
}
.profile-page-wrapper.non-show-inner{
  /*  height: calc(100vh - 150px);
    min-height: calc(100vh - 150px);
    max-height: calc(100vh - 150px);*/
}
a.filter {
    margin-right: 10px;
}
header {
    position: fixed;
    width: 100%;
    left: 0;
    right: 0;
    z-index: 999;
    background: #ffffff;
}

a.customise_tooltip.location-header span.customise_tooltiptext.location-tooltip {
    bottom: 25px;
    box-shadow: -1px 0px 2px 0px #aeb0b1;
}

a.customise_tooltip.location-header span.customise_tooltiptext.location-tooltip::after {
    box-shadow: 1px 2px 1px 0px #dfe0e0;
    border-left: transparent;
    border-top: transparent;
    bottom: -6px;
    border-width: 10px;
}
a.customise_tooltip.location-header p {
    margin: 0;
}
.match-page-wrapper,.profile-page-wrapper.non-show-inner,.Search-page-inner,.Search-page-inner, .profile-page-wrapper{
    padding-top: 110px;
    padding-bottom: 50px;
}
div#password-change-success-popup img {
    display: block;
    text-align: center;
    margin: 0 auto 10px;
    width:80px;
}

div#password-change-success-popup img+h6.thankyou-text {
    text-align: center;
    display: block;
    width: 100%;
    font-size: 30px;
    color: #1f8a80;
}
.signup.container.edit_profile_wrapper.about-page-after-login{
    /*overflow:initial; to fix safari issue*/
}

.loader {
    border: 5px solid #1f8a80;
    border-top: 5px solid #1f8a80;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 2s linear infinite;
    left: 48%;
    position: relative;
}
.message-match-sec-inner.nonShowList+.nonshow_record .loader{
    border: 5px solid #1f8a80;
    border-top: 5px solid #1f8a80;
}
.no_match_record .loader{
    border: 5px solid #1f8a80;
    border-top: 5px solid #1f8a80;
}
.no_buddies_record .loader{
    border: 5px solid #f2f2f2;
    border-top: 5px solid #f2f2f2;
}
.message-matches-section h4.green-text {
   position: fixed;
    left: calc(100% - 70%);
    /*right: 35px;*/
     right: 20px;
    padding-top: 15px;
    padding-bottom: 15px;
    z-index: 999;
    /* margin-top: -10px; */
    /* background: #ffffff; */
    z-index: 99; /*to show header content and grid right*/
}
.message-matches-section.match-page-listing-scroll h4.green-text {
    margin-top: -15px;
}
.profile-page-wrapper.non-show-inner .message-matches-section h4.green-text {
    left: 0;
    padding-left: 30px;
    top: 115px;
}
.message-match-sec-inner.matches_list {
    padding-top: 15px;
}
span.toggle-password {
    position: absolute;
    right: 22px;
    top: 16px;
    cursor: pointer;
    padding: 3px;
    width: 19px;
    background: url(../img/ionic-md-eye.png) no-repeat;
    height: 12px;
    background-size: contain;
    user-select: none;
}

span.toggle-password.show-password{
    background: url(../img/ionic-md-eye-off.png) no-repeat;
    background-size: contain;
    width: 19px;
    right: 22px;
    top: 15px;
    height: 15px;
}
a.btn.btn-primary.border-btn {
    min-width: 380px;
    max-width: 380px;
    background: #ffffff;
    border: 2px solid #ffffff;
    color: #1f8a80;
    display: block;
    margin: 0 auto 20px;
    font-size: 20px;
    font-weight: bold;
    text-transform: capitalize;
}
#favMoreMatches, #loadMoreMatches {
    position: relative;
    bottom: 100px;
}
.fixed-footer {
    z-index: 99;
}
div#filter-box {
    z-index: 99;
}
.chat-window span.user-chat a {
    color: #ffffff !important;
}
.fourth-section .tick-slider-background{
    z-index: 9;
}
.fourth-section .tick-slider-value:after{
    z-index:99;
}
/*CSS for cropper*/
label.cabinet{
    display: block;
    cursor: pointer;
}
label.cabinet input.file{
    position: relative;
    height: 100%;
    width: auto;
    opacity: 0;
    -moz-opacity: 0;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  margin-top:-30px;
}
#upload-demo{
    width: 100%;
    height: 500px;
    padding-bottom:45px;
    padding-top: 60px;
}
.croppie-container .cr-slider-wrap {
    position: absolute;
    top: 0;
}
figure figcaption {
    position: absolute;
    bottom: 0;
    color: #fff;
    width: 100%;
    padding-left: 9px;
    padding-bottom: 5px;
    text-shadow: 0 0 10px #000;
}
figure {
    position: relative;
}
.croppie-container {
    width: 100%;
    height: 100%;
}

.croppie-container .cr-image {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    max-height: none;
    max-width: none;
}

.croppie-container .cr-boundary {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.croppie-container .cr-viewport,
.croppie-container .cr-resizer {
    position: absolute;
    border: 2px solid #fff;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    box-shadow: 0 0 2000px 2000px rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.croppie-container .cr-resizer {
  z-index: 2;
  box-shadow: none;
  pointer-events: none;
}

.croppie-container .cr-resizer-vertical,
.croppie-container .cr-resizer-horisontal {
  position: absolute;
  pointer-events: all;
}

.croppie-container .cr-resizer-vertical::after,
.croppie-container .cr-resizer-horisontal::after {
    display: block;
    position: absolute;
    box-sizing: border-box;
    border: 1px solid black;
    background: #fff;
    width: 10px;
    height: 10px;
    content: '';
}

.croppie-container .cr-resizer-vertical {
  bottom: -5px;
  cursor: row-resize;
  width: 100%;
  height: 10px;
}

.croppie-container .cr-resizer-vertical::after {
    left: 50%;
    margin-left: -5px;
}

.croppie-container .cr-resizer-horisontal {
  right: -5px;
  cursor: col-resize;
  width: 10px;
  height: 100%;
}

.croppie-container .cr-resizer-horisontal::after {
    top: 50%;
    margin-top: -5px;
}

.croppie-container .cr-original-image {
    display: none;
}

.croppie-container .cr-vp-circle {
    border-radius: 50%;
}

.croppie-container .cr-overlay {
    z-index: 1;
    position: absolute;
    cursor: move;
    touch-action: none;
}

.croppie-container .cr-slider-wrap {
    width: 80%;
    display: inline-block;
    margin: 15px;
    float: left;
}

.croppie-result {
    position: relative;
    overflow: hidden;
}

.croppie-result img {
    position: absolute;
}

.croppie-container .cr-image,
.croppie-container .cr-overlay,
.croppie-container .cr-viewport {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

/*************************************/
/***** STYLING RANGE INPUT ***********/
/*************************************/
/*http://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html */
/*************************************/

.cr-slider {
    -webkit-appearance: none;
/*removes default webkit styles*/
    /*border: 1px solid white; *//*fix for FF unable to apply focus style bug */
    width: 300px;
/*required for proper track sizing in FF*/
    max-width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: transparent;
}

.cr-slider::-webkit-slider-runnable-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

.cr-slider:focus {
    outline: none;
}
/*
.cr-slider:focus::-webkit-slider-runnable-track {
background: #ccc;
}
*/

.cr-slider::-moz-range-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

/*hide the outline behind the border*/
.cr-slider:-moz-focusring {
    outline: 1px solid white;
    outline-offset: -1px;
}

.cr-slider::-ms-track {
    width: 100%;
    height: 5px;
    background: transparent;
/*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    border-color: transparent;/*leave room for the larger thumb to overflow with a transparent border */
    border-width: 6px 0;
    color: transparent;/*remove default tick marks*/
}
.cr-slider::-ms-fill-lower {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}
.cr-slider::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}
.cr-slider::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top:1px;
}
.cr-slider:focus::-ms-fill-lower {
    background: rgba(0, 0, 0, 0.5);
}
.cr-slider:focus::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.5);
}
/*******************************************/

/***********************************/
/* Rotation Tools */
/***********************************/
.cr-rotate-controls {
    position: absolute;
    bottom: 5px;
    left: 5px;
    z-index: 1;
}
.cr-rotate-controls button {
    border: 0;
    background: none;
}
.cr-rotate-controls i:before {
    display: inline-block;
    font-style: normal;
    font-weight: 900;
    font-size: 22px;
}
.cr-rotate-l i:before {
    content: '↺';
}
.cr-rotate-r i:before {
    content: '↻';
}
.profile-page-wrapper .col-lg-2.col-md-2.col-sm-12.col-xs-12{
    background: #ededed;
    padding: 15px;
    border-radius: 10px;
}
/*slider css*/
.row > .slide-column {
  padding: 0 8px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

.slide-column {
  float: left;
  width: 25%;
}

/* The Modal (background) */
.modal.lightbox {
  display: none;
  position: fixed;
  z-index: 99999;
  padding-top: 0px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.8);
}

/* Modal Content */
.modal.lightbox .modal-content .mySlides {
   /* max-width: 600px;
    max-height: 600px;*/
}
.lightbox .modal-content {
    position: relative;
    background-color: transparent;
    margin: auto auto;
    padding: 0;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
  /*width: 90%;
  max-width: 1200px;*/
}

/* The Close Button */
.lightbox .close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  opacity: 1;
  font-weight: bold;
  z-index: 99999;
}

.lightbox .close:hover,
.lightbox .close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
}

.slide-container .cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.caption-container .prev,
.caption-container .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}
.caption-container a.prev {
    color: #fff;
    left: 25px;
    position: absolute;
}

.caption-container a.next {
    color: #fff;
    right: 25px;
    position: absolute;
}
/* Position the "next button" to the right */
.slide-container .next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.slide-container .prev:hover,
.slide-container .next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}
.modal.lightbox .mySlides img {
    max-width: 600px;
    max-height: 600px;
    display: block;
    text-align: center;
    margin: 0 auto;
    border:1px solid #dddddd;
}
.modal.lightbox .modal-content {
  /*  max-width: 600px;
    max-height: 600px;*/
}
/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}
.caption-container {
  /*text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;*/
}

.demo {
  opacity: 0.6;
}

.active,
.demo:hover {
  opacity: 1;
}

.slide-container img.hover-shadow {
  transition: 0.3s;
}

.slide-container .hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.row.slide-container .slide-column.profile-image-wrapper{
    width: 270px;
    height: 270px;
    min-width: 270px;
    display: block;
    object-fit: cover;
    min-height: 270px;
    text-align: center;
    margin: 0 auto 15px;
}
.row.slide-container .slide-column.profile-image-wrapper img.profile-image{
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    text-align: center;
    margin: 0 auto;
    border-radius: 2px;
}
.row.slide-container {
    display: flex;
    flex-wrap: wrap;
}
.row.slide-container .below-grid .slide-column:last-child{
    margin-right:0px;
}
.row.slide-container .below-grid .slide-column {
    display: inline-flex;
    width: 60px;
    max-width: 60px;
    height: 60px;
    max-height: 60px;
    margin-right:5px;
    border:1px solid #ddd;
}

.row.slide-container .slide-column img.profile-image-small {
    object-fit: cover;
    width: 100%;
}
.below-grid {
    display: block;
    margin: 0 auto;
    align-items: center;
}
span.gender {
    text-transform: capitalize;
}
.profile-page-inner-wrapper {
    background: #f3ffff;
    padding: 15px 30px;
    border-radius: 10px;
    min-height: calc(100vh - 215px);
}
.profile-page-inner-wrapper p.about-text {
    font-style: italic;
    color: #1f8a80;
    font-weight: bold;
}
.col-lg-12.col-md-12.col-sm-12.col-xs-12.map-div {
    min-height: 220px;
}
.profile-page-wrapper.my-profile {
    min-height: calc(100vh - 48px);
    max-height: calc(100vh - 48px);
}
.profile-page-wrapper.my-profile .inner {
    height: 100%;
    min-height: calc(100vh - 168px);
}
.profile-page-wrapper.my-profile .inner .col-lg-2.col-md-2.col-sm-12.col-xs-12 {
    min-height: calc(100vh - 215px);
    overflow-y: auto;
}
span.sub-cat-data {
    font-weight: 400;
}
.img-thumbnail {
    background-color: transparent;
    padding: 0;
}
.croppie-container .cr-slider-wrap input[type="range"] {
    opacity: 1;
    display: block;
    background-image: linear-gradient(#fff 50%, #cecece 65%, #fff 80%) !important;
    background: transparent;
    height: 0;
    border-radius: 20px;
    position: unset;
    line-height: 1.0;
}
p.cropper-text.small-font {
    text-align: left;
    display: block;
    line-height: 1.0;
    margin-bottom: 10px;
}
div#cropImagePop .modal-body {
    padding-bottom: 10px;
}
div#cropImagePop .modal-header {
    border: none;
}
.row.slide-container .below-grid .slide-column.unbordered-div {
    border: none;
}
a.right-btn.customise_tooltip.buddy-tooltip span.customise_tooltiptext {
    padding: 7px !important;
}
.chat-box-content .conversationMessageBox p.message-time.margin0,.chat-box-content .conversationMessageBox .sent-message p.message-time.margin0,
.chat-box-content .conversationMessageBox .recive-message p.message-time.margin0{
    text-align: inherit;
}
.signup-inner ul.black-font.custom-list li::before {
   position: absolute;
   content: "";
   width: 7px;
   height: 7px;
   border-radius: 50%;
   left: -15px;
   display: block;
   top: 10px;
   background: #333;
}

.signup-inner ul.black-font.custom-list li {
    position: relative;
}

.signup-inner ul.black-font.custom-list::before {
    display: none;
}
.how-it-works-sec {
    display: flex;
    align-items: center;
    margin:180px 0px;
}
.how-it-works-sec:first-child {
    margin-top: 50px;
}
.first-sec .img-sec {
    position: relative;
}

.first-sec .img-sec+.text-sec,.third-sec .img-sec+.text-sec,.fifth-sec .img-sec+.text-sec {
    right: -34px;
    min-width: 280px;
    height: auto;
    max-width: 350px;
    line-height: 1.3;
    font-size: 14px;
    top: 74px;
}
.second-sec .text-sec,.fourth-sec .text-sec{
    right: -34px;
    min-width: 280px;
    height: auto;
    max-width: 350px;
    line-height: 1.3;
    font-size: 14px;
    top: 74px;
}
span.small-icon img {
    width: 80px;
    max-width: 80px;
    margin-right: 10px;
}
.first-sec .img-sec+.text-sec .inner-content ,
.third-sec .img-sec+.text-sec .inner-content,.fifth-sec .img-sec+.text-sec .inner-content {
    line-height: 1.2;
    background: url(../img/bgleft.png);
    background-position: center right;
    background-size: cover;
    min-height: 98px;
    position: relative;
    font-size: 12px;
    text-align: center;
    padding:  10px 10px 10px 30px;
    min-width: 370px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.second-sec .text-sec .inner-content span.small-icon img,
.fourth-sec .text-sec .inner-content span.small-icon img {
   left: unset;
    right: -21px;
    margin-right: 0;
    z-index: 9;
    margin-left: 10px;
}
.img-sec img {
    max-width: 290px;
}
.second-sec .text-sec .inner-content ,.fourth-sec .text-sec .inner-content{
    line-height: 1.2;
    background: url(../img/bgright.png);
    padding:9px 45px 5px 10px;
    background-position: center left;
    background-size: cover;
    min-height: 98px;
    font-size: 12px;
    background-repeat: no-repeat;
    text-align: center;
    min-width: 370px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.how-it-works-sec .inner-content p {
    margin: 0;
    padding: 14px;
    font-size: 14px;
    font-weight: bold;
}
.first-sec .img-sec+.text-sec .inner-content,
.third-sec .img-sec+.text-sec .inner-content,{
    position: relative;
}
.fourth-sec .text-sec .inner-content,.second-sec .text-sec .inner-content{
     position: relative;
}
.signup-inner {
    padding-bottom: 80px;
}
#map {
    min-height: 350px;
    max-width: 80%;
}
.map-div{
    margin-bottom: 30px; 
    margin-top:10px;
}
span.small-icon {
    margin: 0;
}
span.small-icon img {
    position: absolute;
    top: 13px;
    left: -40px;
}
.first-sec .img-sec,.second-sec .img-sec,.third-sec .img-sec,.fourth-sec .img-sec,.fifth-sec .img-sec{
    position: relative;
}
.how-it-work-wrapper {
    background: #f3ffff;
    /*padding-bottom: 100px;*/
}
.how-it-work-wrapper .signup-inner {
    margin: 0 auto;
    display: block;
    padding-top: 50px;
    width: 40%;
    max-width: 40%;
}
.how-it-work-outer .row {
    margin: 0;
}
.how-it-work-wrapper .col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.back-btn {
    margin-top: 20px;
}
.how-it-work-wrapper img.centered-logo {
    margin: 10px auto 25px;
}
.how-it-work-wrapper:last-child{
    margin-bottom: 0px;
}
/*to justify text*/
.signup.container.about_before_login p,.signup.container.about_before_login.story-page p,
.signup.container.about_before_login.t_and_c ul.black-font.custom-list,.signup.container.edit_profile_wrapper.about-page-after-login p,
.signup.container.edit_profile_wrapper.about-page-after-login.t_and_c p,
.signup.container.edit_profile_wrapper.about-page-after-login.t_and_c ul.black-font.custom-list,
.signup.container.edit_profile_wrapper.about-page-after-login.guidelines p,
.signup.container.edit_profile_wrapper.about-page-after-login.story-page p{
    text-align: justify;
}
ul.grey-text.font-16.custom-list.hobbies-list {
    text-align: justify;
}
.caption-container a.next:hover,.caption-container a.prev:hover{
    border-radius: none !important;
    text-decoration:unset;
}
button#cropImageBtn {
    /*min-width: 80px;*/
   /*text-transform: uppercase;*/
}
div#myModalCreatePassword button {
   /* display: inline-block;
    border: none;
    background: transparent;*/
}
button#cropImageBtn button {
    background: transparent;
    border: none;
}
div#cropImagePop button {background: transparent;border: none;display: inline-block;}
div#cropImagePop button img {
    width: 25px;
}
.col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.back-btn.flex-start a.back-btn-tag img {
    margin-right: 6px;
    vertical-align: inherit;
}
.col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.back-btn.flex-start {
    justify-content: flex-start;
}
.row.margin-top-40.qu_1 span.customise_tooltiptext.yourself{ 
   /* bottom: unset;
    left: unset;
    top: 50px;
    width: 133px;
    right: 0;*/
    bottom: unset;
    left: 0;
    top: 75px;
    /*width: 133px;*/
    right: 0;
}
.row.margin-top-40.qu_2 span.customise_tooltiptext.yourself {
    bottom: unset;
    left: 0;
    top:75px;
    /*width: 90px;*/
    /*to fixed the issue reported in sheet at 11 aug https://www.screencast.com/t/CZwo9cP3*/
}
.row.margin-top-40.qu_1 span.customise_tooltiptext.yourself::after {
    /*left: 67px;*/ 
    left: 24px;
}
.row.margin-top-40.qu_2 span.customise_tooltiptext.yourself::after {
    /*left: unset;*/
    /*to fixed the issue reported in sheet at 11 aug https://www.screencast.com/t/CZwo9cP3*/
}

.row.margin-top-40.qu_2 label.radiobox-container {
    padding-right: 10px;
    /*text-transform: capitalize;*/
    line-height: 1.3;
}
.row.margin-top-40.qu_1 .label-wrapper label.custom-multiselect {
    text-transform: unset;
}
.filter-box .custom-multiselect-wrapper.area-wrapper label.custom-multiselect,.filter-box .margin-top-15.custom-multiselect-wrapper.are-you-wrapper label.custom-multiselect{
    text-transform: unset;
}
.search-page-inner .tick-slider-progress{
        z-index: 99;
}
.search-page-inner .custom-multiselect-wrapper.remove-capitalise .label-wrapper label.custom-multiselect {
    text-transform: none;
}
.signup.container.edit_profile_wrapper.about-page-after-login .alert.alert-success.contact-sucess{
    max-width: 100%;
}
.signup.container.edit_profile_wrapper.about-page-after-login .alert.alert-danger.contact-danger{
     max-width: 100%;
}
/*to fix sfari outline*/
a:focus-within{
    outline-width: 0px;
    outline-color: none;
    outline-style: none;
}
/*to fix sfari outline*/
form.login_form_submit {
     margin: 0 auto; 
     max-width: 460px; 
}
.justify-content-center.join-piper-wrap {
    display: flex;
}
.welocome-page .justify-content-center.join-piper-wrap p {
    color: #f2f2f2;
}
a.join-piper-link {
    color: #ffffff;
    font-weight: bold;
    text-transform: capitalize;
    text-decoration: underline;
}
.welocome-page form.login_form_submit .login-btn-wrapper button {
    /*margin: 40px auto 30px;*/
}

.form-group.row.contact-math-captcha #sum_value::placeholder {
    font-size: 16px;
    margin: 0;
    padding: 0;
    line-height: 16px;
    font-weight: 400;
    color: #777777;
}
a.home-nav {
    /*color: #1f8a80;*/
    color: #fff;
    font-weight: bold;
    display: block;
    position: absolute;
    top: 10px;
    right: 20px;
    z-index:999;
}
.body-bg.successful-body-bg .success-page a.primary-link {
    min-width: auto;
      text-transform: unset;
}
.filter-box .grey-bg-heading {
    text-transform: none;
}
.popover {
    font-family: 'Lato' !important;
}
label.custom-multiselect.tandc {
    text-transform: none;
}

.label-wrapper.tandc-wrapper {
    width: 100%;
    padding: 0;
    margin: 0;
}
/*.margin-left-5{
    margin-left: 5px;
}*/
.full-width label.custom-multiselect ,.newsletter-edit-profile label.custom-multiselect{
    font-size: 15px;
    text-transform: none;
    font-family: inherit;
}

.full-width label.custom-multiselect span.checkmark,.newsletter-edit-profile label.custom-multiselect span.checkmark{
    width: 18px;
    height: 18px;
}

.full-width label.custom-multiselect span.checkmark:after,.newsletter-edit-profile label.custom-multiselect span.checkmark:after{
    left: 4px;
    top: 0px;
}
u.underline.margin-left-5 a {
    color: #333;
}
.sign-up-back-btns a {
    color: #111111;
    border-radius: 6px;
    padding: 5px 14px 7px;
    margin: 0 7px;
    border: 2px solid #111111;
    font-weight: bold;
}
.sign-up-back-btns {
    display: flex;
    padding: 30px 30px 120px;
    justify-content: flex-end; 
}
/*to manage logn word without space*/
.sent-message .message-container p.margin0 {
    word-break: break-word;
}
/*to manage logn word without space*/
.body-bg.register-page {
    /*background-repeat: repeat !important;*/
    background-position: top !important;
    /*background-size: 100%;*/
}
.flex-center.position-ref.full-height p.error_message{
    margin-bottom: 0;
    padding-bottom: 0;
    font-family: 'Lato' !important;
}
/*to manage scroll*/
.signup.container.edit_profile_wrapper.about-page-after-login.t_and_c .signup-inner {
    min-height: 90vh;
}
.fourth-section .tick-slider-background {
    background-color: #f3ffff;
}
.green-colored-bg.message-buddies-sidebar .buddies-sidebar-inner h6.categories span.read-more {
    color: #fff;
    font-weight: 800;
}
.grey-bg-heading.location-heading-space {
    margin-top: 35px;
}
input.location-selection-btn {
    background: #1f8a80;
    border: none;
    color: #ffffff;
    font-size: 12px;
    margin-left: 8px;
    font-weight: bold;
    padding: 5px 12px;
    border-radius: 15px;
}
.location-selected-wrapper .col-lg-12.col-md-12.col-sm-12.col-xs-12 {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: center;
}

span.location-selected.view-location-selected-address{
    width: calc(70% - 8px);
    max-width: calc(70% - 8px);
    min-width: calc(70% - 8px);
    height: auto;
    justify-content: center;
    align-items: center;
    font-size: 14px;
    cursor: none;
}

input.location-selection-btn {
    width: 30%;
    max-width: 30%;
    min-width: 30%;
}
input.location-selected, input.location-selected:focus, input.location-selected:hover {
    border: none;
    outline: none;
}
.margin-top-15.custom-multiselect-wrapper.location-selected-wrapper .col-lg-12.col-md-12.col-sm-12.col-xs-12 {
    /*padding-left: 0px;*/
    max-width: calc(100% + 15px);
    min-width: calc(100% + 15px);
    padding-right: 0;
}
input.location-selected {
    font-size: 14px;
    color: #212529;
}
.margin-top-15.custom-multiselect-wrapper.location-selected-wrapper .row {
    width: 100%;
}
div#locationselectonmap .modal-dialog.modal-dialog-centered {
    min-width: 80vw;
}
#locationselectonmap .location-modal-wrapper{
    max-width: 100%;
    margin: 0 auto;
    text-align: left;
    display: block;

}

.location-modal-wrapper.locationselectonmap-wrapper .col-md-12 div#map {
    width: 100%;
    padding: 0;
    margin: 0;
    min-width: 100%;
}

.location-modal-wrapper.locationselectonmap-wrapper .col-md-12 {
    padding: 0;
}
.row.select-btn-wrapper p.location-value {
    float: left;
    width: calc(100% - 150px);
    text-align: left;
    margin-bottom: 0;
    margin-top: 8px;
}

.row.select-btn-wrapper p.location-value+button.btn.btn-primary {
    float: right;
    width: 140px;
    margin-left: 10px;
}

.row.select-btn-wrapper {
    clear: both;
    margin: 20px 0px 0px 0px;
    width: 100%;
    padding: 0;
}
.bold-font {
    font-weight: bold;
}
.send-btn-wrapper {
    padding-right: 0;
}
a.cancel-btn.edit-profile-btn {
    background: #1f8a7f;
    font-weight: bold;
    text-decoration: none;
    padding: 2px 15px;
    color: #fff;
    text-transform: capitalize;
    border-radius: 3px;
}
.alert.alert-success.mobile-sucess-msg{
    display: none;
}
button.btn.btn-primary.submit-login:disabled {
    background: #1f8a80;
}
.row.yes-no-btn-wrapper form {
    display: inline-block;
}
input.selected_address+button.btn.btn-primary.select-btn {
    min-width: 150px;
}
span.show-visitor {
    color: #fff;
    position: absolute;
    background: #1f8a80;
    top: -1px;
    right: -1px;
    width: 60px;
    padding: 0;
    font-weight: 800;
    height: 24px;
    font-size: 14px;
    border-bottom-left-radius: 10px;
    border-top-right-radius: 10px;
}
span.show-visitor-fav{
    color: #1f8a80;
    position: absolute;
    background: #ffffff;
    top: -1px;
    right: -1px;
    width: 60px;
    padding: 0;
    font-weight: 800;
    height: 23px;
    font-size: 14px;
    border-bottom-left-radius: 10px;
    border-top-right-radius: 10px;
}

.inner-grid.light-orange.white-text {
    position: relative;
}
button.btn.btn-primary.location-value-btn {
    min-width: 150px;
}
/*map design CSS*/
#description {
  font-family: inherit;
  font-size: 15px;
  font-weight: 300;
}

#infowindow-content .title {
  font-weight: bold;
}

#infowindow-content {
  display: none;
}

#map #infowindow-content {
  display: inline;
}

.pac-card {
  margin: 10px 10px 0 0;
  border-radius: 2px 0 0 2px;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  outline: none;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  background-color: #fff;
  font-family: inherit;
}

#pac-container {
  padding-bottom: 12px;
  margin-right: 12px;
}

.pac-container { z-index: 10000 !important; }

.pac-controls {
  display: inline-block;
  padding: 5px 11px;
}

.pac-controls label {
  font-family: inherit;
  font-size: 13px;
  font-weight: 300;
}

#pac-input {
    background-color: #fff;
    font-family: inherit;
    font-size: 15px;
    color: #333;
    font-weight: 400;
    margin-left: 0;
    padding: 11px;
    text-overflow: ellipsis;
    border-radius: 0px;
    width: 350px;
    border: 1px solid #e4dddd;
}

#pac-input:focus {
  border-color: #e4dddd;
}

#title {
  color: #fff;
  background-color: #4d90fe;
  font-size: 25px;
  font-weight: 500;
  padding: 6px 12px;
}

#target {
  width: 345px;
}
input#pac-input:focus-visible {
    outline: none;
}

input#pac-input {
    top: 10px !important;
    right: 10px !important;
    box-shadow: 0px 2px 8px 0px #eaeaea;
}
input#noOfRoom {
    max-width: 65px;
    text-align: center;
    padding: 0;
}
input#subs {
    margin-left: 0px;
    margin-right: 7px;
    color: #fff;
    border-radius: 30px;
    font-size: 27px;
    margin-top: 10px;
    line-height: 0.15;
    padding: 7px 6px 10px;
    background: #1f8a80;
}
input#adds{
    color: #fff;
    border-radius: 30px;
    font-size: 20px;
    margin-top: 10px;
    margin-left: 7px;
    line-height: 0.15;
    padding: 8px 5px 10px;
    background: #1f8a80;
}
input#adds:focus,input#subs:focus{
    box-shadow: none;
}
p.error_rang.invalid-feedback.block-error {
    margin-top: 10px;
}
.shown-only-mobile{
    display: none;
}
/*div#myModalCreatePassword button {
    display: inline-block;
    border: none;
    background: transparent;
}*/
button#cropImageBtn button {
    background: transparent;
    border: none;
}
button#cropImageBtn button:focus{
    outline: none;
    border:none;
}
button#cropImageBtn:focus {
    outline: none;
}
div#cropImagePop button {background: transparent;border: none;display: inline-block;padding-right: 0;
    margin-right: 0;}
div#cropImagePop button img {
    width: 25px;
}

p.cropper-text.small-font {
    position: absolute;
    top: 33px;
    padding: 15px;
    left: 0;
    text-align: center;
    display: block;
    right: 0;
}
div#cropImagePop .btn-wrap {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 9999;
}
.counter-wrapper {
    display: block;
    margin: 15px auto 0px;
    text-align: center;
    width: max-content;
}
div#filter-box p.error_rang.invalid-feedback.block-error {
    margin: 15px auto 0px;
    text-align: center;
}
.counter-wrapper input#noOfRoom {
    background: transparent;
}

.second-search-div h4 {
    font-size: 16px;
    margin: 0;
    padding: 10px 15px;
    color: #1b1a1a;
    font-weight: bold;
}
.second-search-div {
    background: linear-gradient(45deg, #c3bfbf, #d0d0d0);
}

/*design for group messaging */
.row.search-btn-custom{
    margin: 25px 20px 15px;
}
.green-header{
    color: #ffffff;
    background-color:#1f8a80 ;
}
.green-header {
    background: #1f8a80;
    display: block;
    text-align: center;
    color: #fff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
div#myModaladdGroup .modal-body,div#myModaleditGroup .modal-body{
    padding: 0;
}
.green-header h4.white-heading {
    font-size: 18px;
    font-weight: bold;
    padding: 15px;
    margin: 0;
}
button.close-custom-btn,button.right-custom-btn{
    position: absolute;
    top: 5px;
    right: 5px;
    background:transparent;
    border: none;
    outline: none;
}
button.close-custom-btn:focus,button.close-custom-btn:focus{
    outline:none;
    border: none;
}
button.right-custom-btn img {
    width: 18px;
}
.members-list .label-wrapper img {
    max-width: 40px;
    border-radius: 110%;
    width: 100%;
    min-width: 40px;
    float: left;
    cursor: pointer;
    max-height: 40px;
    min-height: 40px;
    object-fit: cover;
}
.members-list .label-wrapper {
    width: 100%;
    display: flex;
    padding: 10px 22px 10px;
    border-bottom: 1px solid #ddd;
    flex-wrap: wrap;
    margin-bottom: 0;
}
.members-list .label-wrapper label.custom-multiselect span.checkmark {
    left: unset;
    right: -11px;
    width: 16px;
    height: 16px;
    top: 12px;
    background: #f2f2f2;
}
.members-list .label-wrapper label.custom-multiselect input:checked ~ .checkmark{
    background: #1f8a80;
}
.members-list .label-wrapper label.custom-multiselect span.checkmark:after {
    left: 3px;
    top: -1px;
}
.members-list .label-wrapper label.custom-multiselect {
    padding-left: 10px;
    max-width: calc(100% - 50px);
    min-width: calc(100% - 50px);
    padding-top: 8px;
}
.members-list {
    max-height: 380px;
    overflow-y: auto;
}

.justify-content-center div.error_text_center {
    text-align: center;
    font-size: 15px;
}

.stickey-footer button.btn-primary {
    outline: none;
    border: none;
    padding: 7px 35px;
    font-weight: bold;
    border-radius: 5px;
}
.stickey-footer {
    text-align: center;
    padding: 15px;
}
.edit-group-span{
    cursor: pointer;
}
div#myModaleditGroup .green-header {
    padding: 20px;
}
button.group-img-edit{
    background: transparent;
    border: none;
    outline: none;
    position: absolute;
    top: 0;
    right: 0;
}
.group-image {
    display: inline-block;
    position: relative;
    /*max-width: 250px;*/
}
input.group-name {
    background: transparent;
    border: none;
    width: auto;
    color: #ffffff;
    text-align: right;
    padding-right: 10px;
    font-size: 20px;
}
.row.margin-top-10.group-name-wrapper {
    position: relative;
}
span.edit-group-name,span.save-group-name {
    position: absolute;
    right: 10px;
}
input.group-name:focus {
    outline: none;
    border: none;
}
.margin-top-10{
    margin-top: 10px;
}
span.edit-group-name {
    cursor: pointer;
}
span.save-group-name {
    cursor: pointer;
}
.padding-left-right-15{
    padding: 15px 15px;
}
button.add-people,button.transparent-btn{
    background: transparent;
    border: none;
    padding: 0;
    font-size: 16px;
}
button.add-people:focus,button.transparent-btn:focus,button.del-btn:focus{
    outline: none;
}
button.add-people img,button.transparent-btn img {
    /* width: 28px; */
    margin-right: 5px;
}
.add-people-wrapper {
    padding: 0 15px;
}
.border-bottom{
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
}
.group-people {
    padding: 5px 10px 2px 0px;
}
.group-settings-heading h6.black-font {
    color: #000;
    font-weight: bold;
    padding-left: 10px;
    padding-top: 2px;
}
button.del-btn {
    background: transparent;
    border: none;
    float: right;
    margin-top: 7px;
}
.group-settings-heading{
    background: #d0d0d0;
    padding: 5px 10px 2px;
}
.group-people.switch-wrapper .switch {
    position: relative;
    /*width: calc(100% - 130px);*/
    height: 10px;
    float: right;
}
.group-people.switch-wrapper span {
    min-width: calc(100% - 28px);
}
.group-people.switch-wrapper input { 
    opacity: 0;
    width: 0;
    height: 0;
}
/*label.switch .slider {
    position: absolute;
    cursor: pointer;
    top: 8px;
    height: 12px;
    left: 94%;
    border-radius: 11px;
    right: 0;
    bottom: 0;
    background-color: #d0d0d0;
    -webkit-transition: .4s;
    transition: .4s;
}*/
/*label.switch .slider:before {
    position: absolute;
    content: "";
    height: 10px;
    width: 10px;
    border-radius: 18px;
    left: 1px;
    bottom: 2px;
    background-color: #ababab;
    -webkit-transition: .4s;
    transition: .4s;
}*/
button.exit-btn {
    background: transparent;
    border: none;
    padding: 0px 18px 10px 15px;
    font-weight: bold;
    color: #f52323;
}
/*input:checked + .slider {
    background-color: #4d4d4d;
}*/
input:focus + .slider {
    background-color: #827f7b;
    box-shadow: 0 0 1px ;
}
input:checked + .slider:before {
    -webkit-transform: translateX(13px);
    -ms-transform: translateX(13px);
    transform: translateX(13px);
}

p.sender-name {
    margin: 0;
    font-size: 12px;
    color: #446c74;
    font-weight: bold;
}
button.show-more {
    background: transparent;
    border: none;
    text-decoration: underline;
    font-size: 14px;
    color: #333;
    font-weight: bold;
}
.show-more-wrapper {
    float: none;
}
.show-more-wrapper {
    float: none;
    display: flex;
    justify-content: flex-end;
}
.bold-font {font-weight: 600;}
/* tag section design */
.tag-section-list {
    position: absolute;
    border-radius: 5px;
    bottom: 120px;
    max-width: 190px;
    box-shadow: -1px -1px 4px 0px #ddd;
    padding: 0px 0px 10px 10px;
    background: #fff;
}
.tag-section-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.tag-section-list li img {
    width: 24px;
    height: 25px;
    border-radius: 50%;
    /*to remove stretch of img*/
    object-fit: cover;
}
.tag-section-list ul li {
    margin-left: -10px;
    padding-left: 15px;
}
span.img-taged {
    margin-right: 5px;
}
.tag-section-list ul li {
    padding: 5px 15px 5px 0px;
    display: flex;
    line-height: 1.2;
}
.send-btn-wrapper {
    position: relative;
}
.tag-section-list{
    max-height: 200px;
    overflow-y: auto;
}
/* tag section design */

/* design for group messaging */
div#myModaladdGroup .row.search-btn-custom {
    margin: 15px 20px 10px;
}
div#myModaladdGroup .row {
    margin: 0;
}
.row.search-btn-custom{
    margin: 25px 20px 15px;
}
.green-header{
    color: #ffffff;
    background-color:#1f8a80 ;
}
.green-header {
    background: #1f8a80;
    display: block;
    text-align: center;
    color: #fff;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}
div#myModaladdGroup .modal-body,div#myModaleditGroup .modal-body{
    padding: 0;
}
.green-header h4.white-heading {
    font-size: 18px;
    font-weight: bold;
    padding: 15px;
    margin: 0;
}
button.close-custom-btn,button.right-custom-btn{
    position: absolute;
    top: 5px;
    right: 5px;
    background:transparent;
    border: none;
    outline: none;
}
button.close-custom-btn:focus,button.close-custom-btn:focus{
    outline:none;
    border: none;
}
button.right-custom-btn img {
    width: 18px;
}
.members-list .label-wrapper img {
    max-width: 40px;
    border-radius: 110%;
    width: 100%;
    min-width: 40px;
    float: left;
    cursor: pointer;
    max-height: 40px;
    min-height: 40px;
    border:1px solid #dddddd;
    object-fit: cover;
}
.members-list .label-wrapper {
    width: 100%;
    display: flex;
    padding: 10px 22px 10px;
    border-bottom: 1px solid #ddd;
    flex-wrap: wrap;
    margin-bottom: 0;
}
.members-list .label-wrapper label.custom-multiselect span.checkmark {
    left: unset;
    right: -11px;
    width: 16px;
    height: 16px;
    top: 12px;
    background: #f2f2f2;
}
.members-list .label-wrapper label.custom-multiselect input:checked ~ .checkmark{
    background: #1f8a80;
}
.members-list .label-wrapper label.custom-multiselect span.checkmark:after {
    left: 3px;
    top: -1px;
}
.members-list .label-wrapper label.custom-multiselect {
    padding-left: 10px;
    max-width: calc(100% - 50px);
    min-width: calc(100% - 50px);
    padding-top: 8px;
}
.members-list {
    max-height: 380px;
    overflow-y: auto;
}
.stickey-footer button.btn-primary {
    outline: none;
    border: none;
    padding: 7px 35px;
    font-weight: bold;
    border-radius: 5px;
}
.stickey-footer {
    text-align: center;
    padding: 15px;
}
.edit-group-span{
    cursor: pointer;
}
div#myModaleditGroup .green-header {
    padding: 20px;
}
button.group-img-edit{
    background: transparent;
    border: none;
    outline: none;
    position: absolute;
    top: 0;
    padding: 0;
    right: 5px;
}
.group-image {
    display: inline-block;
    position: relative;
    /*max-width: 104px;*/
    margin-top: 25px;
}
input.group-name {
    background: transparent;
    border: none;
    color: #ffffff;
    text-align: center;
    font-size: 20px;
}
.row.margin-top-10.group-name-wrapper {
    display: flex;
    max-width: 100%;
    justify-content: center;
    align-items: center;
    align-content: center;
    flex-wrap: wrap;
}
input.group-name:focus {
    outline: none;
    border: none;
}
.margin-top-10{
    margin-top: 10px;
}
span.edit-group-name {
    cursor: pointer;
}
span.save-group-name {
    cursor: pointer;
}
span.save-group-name img{
    width: 23px;
}
.padding-left-right-15{
    padding: 15px 15px;
}
button.add-people,button.transparent-btn{
    background: transparent;
    border: none;
    padding: 0;
    font-size: 16px;
}
button.add-people:focus,button.transparent-btn:focus,button.del-btn:focus{
    outline: none;
}
button.add-people img,button.transparent-btn img {
    /* width: 28px; */
    margin-right: 5px;
}
.add-people-wrapper {
    padding: 0 15px;
}
.border-bottom{
    border-bottom: 1px solid #ddd;
    padding-bottom: 5px;
}
.group-people {
    padding: 5px 10px 2px 0px;
}
.group-settings-heading h6.black-font {
    color: #000;
    font-weight: bold;
    padding-left: 10px;
}
button.del-btn {
    background: transparent;
    border: none;
    float: right;
    margin-top: 7px;
}
.group-settings-heading{
    background: #d0d0d0;
    padding: 5px 10px 2px;
}
.group-people.switch-wrapper .switch {
    position: relative;
    display: inline-block;
}
.group-people.switch-wrapper input { 
    opacity: 0;
    width: 0;
    height: 0;
}
.group-people.switch-wrapper .slider {
    position: absolute;
    cursor: pointer;
    top: 8px;
    height: 12px;
    border-radius: 11px;
    right: 0;
    bottom: 0;
    background-color: #e2e2e2;
    -webkit-transition: .4s;
    transition: .4s;
    width:26px;
}
.group-people.switch-wrapper .slider:before {
    position: absolute;
    content: "";
    height: 14px;
    width: 14px;
    border-radius: 18px;
    left: -2px;
    bottom: -.5px;
    box-shadow: 0px 0px 5px 1px #c5bebe;
    background-color: #8a8585;
    -webkit-transition: .4s;
    transition: .4s;
    left:-4px;
}
button.exit-btn {
    background: transparent;
    border: none;
    padding: 0px 18px 10px 15px;
    font-weight: bold;
    color: #f52323;
}
.group-people.switch-wrapper input:checked + .slider:before {
    background-color: #ffffff;
    box-shadow: 0px 0px 3px 0px #757070;
}
.group-people.switch-wrapper input:checked + .slider{
     background-color: #1f8a80;
}
.group-people.switch-wrapper input:checked + .slider:before {
    -webkit-transform: translateX(21px);
    -ms-transform: translateX(21px);
    transform: translateX(21px);
}
p.sender-name {
    margin: 0;
    font-size: 12px;
    color: #446c74;
    font-weight: bold;
}
button.show-more {
    background: transparent;
    border: none;
    text-decoration: underline;
    font-size: 14px;
    color: #333;
    font-weight: bold;
}
.show-more-wrapper {
    float: none;
}
.show-more-wrapper {
    float: none;
    display: flex;
    justify-content: flex-end;
}
.bold-font {font-weight: 600;}
.groupMemberLi .group-people a img ,.add-people-wrapper.border-bottom span.transparent-btn img{
    max-width: 45px;
    margin-right: 5px;
    width: 45px;
    object-fit: cover;
    min-width: 45px;
    min-height: 45px;
    background: #ddd;
    border-radius: 50%;
    border: 1px solid #dddddd;
}
.group-people.show-more-wrapper {
    padding: 10px 20px 15px;
}
.group-settings-heading {
    margin-top: 0px;
}
.group-image input#groupFile1 {
    position: absolute;
    z-index: 999999999;
    opacity: 0;
    right: 0;
    top: 0;
    max-width: 100px;
    left: 0px;
    cursor: pointer;
    bottom: 0;
    font-size: 0;
    width: 100%;
}
button.group-img-edit{
    cursor: pointer;
    z-index: 999;
}
img#groupFile1-img{
    /*max-width: 104px;
    min-width: 104px;
    border-radius: 50%;
    max-height: 104px;
    min-height: 104px;
    height: 104px;
    width: 104px;
    object-fit: cover;*/
    max-width: 100px;
    min-width: 100px;
    border-radius: 50%;
    max-height: 104px;
    min-height: 104px;
    height: 104px;
    width: 100px;
    object-fit: unset;
    cursor: pointer;
}
div#myModaladdGroup .green-header {
    padding-bottom: 0px;
}
.groupMemberLi .group-people a{
    text-decoration: none;
    color: #000000;
}
button.show-more:focus{
    outline: none !important;
}
div#myModaladdGroup .row.margin-top-10.group-name-wrapper {
    padding-bottom: 25px;
}
button.group-img-edit img {
    cursor: pointer !important;
    z-index: 9999999 !important;
}
input.group-name {
    width: 402px;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
}
.add-people-wrapper.border-bottom {
    padding: 8px 15px 8px;
}
button.mute-group-btn {
    background: transparent;
    border: none;
    outline: none;
    padding: 0px 0px 0px;
    cursor: pointer;
}
button.mute-group-btn img {
    width: 15px;
    margin: 5px 0px;
    float: right;
    padding: 0;
}
span.mute-group {
    float: right;
}
button.mute-group-btn:hover,button.mute-group-btn:focus,button.exit-btn:focus,button.exit-btn:hover {
    outline:none;
}
button.group-img-edit {
    background-image: url(../img/editiconplaceholder.png);
    width: 23px;
    height: 23px;
    background-position: right;
    border: 0;
    position: absolute;
    right: 0px;
    top: 0px;
    cursor: pointer;
    z-index: 9999999;
}
.conversion-text {
    text-align: center;
    margin-bottom: 15px;
}
.conversion-text,.conversion-text span{
    font-size: 12px;
    color: #a0a0a0;
}
div#myModaladdGroup .row.margin-top-10.group-name-wrapper+.error-wrapper {
    margin: -20px 0px 0px 0px;
    padding-bottom: 8px;
}

div#myModaladdGroup .row.margin-top-10.group-name-wrapper+.error-wrapper p.error_group_title.invalid-feedback {
    background: #ffffff;
    max-width: max-content;
    font-weight: bold;
    padding: 3px 18px;
    border-radius: 19px;
    text-align: center;
    /*display: block !important;*/
    margin: 0 auto;
}
span.user-span {
    white-space: nowrap;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}
p.sender-name {
    text-transform: capitalize;
}
.conversationMessageBox.conversion-text-wrapper{
    clear: both;
}
.user-list .content-wrapper p.user-msg {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
span.mute-group-msg {
   padding-right: 10px;
    width: 90%;
    max-width: 90%;
    white-space: nowrap;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
}
.members-list .label-wrapper label.custom-multiselect {
    text-transform: none;
}
p.user-msg.for-mute-msg {white-space: unset;line-height: 1.0;}
p.deactivate-user {
    font-size: 14px;
    background: #f2f2f2;
    color: #446c74;
    padding: 10px;
    text-align: center;
    margin: 0 10px 0px;
    display: block;
    border-radius: 5px;
    line-height: 1.0;
    font-weight: bold;
}
/*Say something about yourself * tooltip position fixed with dynamic text starts*/
label.black-small-font.special-tooltip {
    clear: both;
    float: none;
}
label.black-small-font.special-tooltip a.customise_tooltip.img-btn {
    position: relative;
}
label.black-small-font.special-tooltip a.customise_tooltip.img-btn+span.customise_tooltiptext.yourself {
    top: 50px;
}
/*Say something about yourself * tooltip position fixed with dynamic text ends*/
/*https://www.screencast.com/t/Xn1Os4UiUA color issue fixed starts*/
.conversationMessageBox.conversion-text-wrapper .message-container a:hover,.conversationMessageBox.conversion-text-wrapper .message-container a {
    text-decoration: none;
    color: inherit !important;
    font-weight: 800;
    cursor: inherit;
}
span.mentioned-user-span b {
    font-weight: 800 !important;
}
.sent-message div br,.recive-message div br,.conversationUserListBox div br{
    display: none;
}
.recive-message p:empty,.sent-message p:empty{
    display: none;
}
/*https://www.screencast.com/t/Xn1Os4UiUA color issue fixed ends*/
/*Reactivate screen design CSS*/
.body-bg.reactivate-screen {
    background: #f3ffff !important;
    text-align:center;
    display: flex;
    justify-content: center;
    align-items: center;
}
.reactivate-screen-inner img.logo-img {
    max-width: 220px;
    margin: 20px auto 20px auto;
}
.body-bg.reactivate-screen h2.green-text {
    color: #1f8a80;
    font-weight: bold;
    margin-bottom: 30px;
}
a.reactivate-account,a.reactivate-account:hover,a.reactivate-account:focus {
    text-decoration: none;
    color: #ffffff;
}
a.reactivate-account {
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    background: #258a80;
    border-radius: 5px;
    padding: 12px 25px;
}
a.logout-link ,a.logout-link:hover,a.logout-link:focus{
    color: #101010;
    font-weight: bold;
    font-size: 18px;
    text-decoration: none;
    border-bottom: 1px solid;
}
/*Reactivate screen design CSS ends*/
/*Deactivate link on profile page*/
div#deactivate-user-confirm-popup .modal-dialog.modal-dialog-centered {
    max-width: 420px;
}
div#deactivate-user-confirm-popup .location-modal-wrapper .row.yes-no-btn-wrapper {
    margin-bottom:0px;
}
div#deactivate-user-confirm-popup .location-modal-wrapper {
    margin-bottom:10px;
}
a.open-confirm-deactivate,a.open-confirm-deactivate:hover {
    text-decoration: none;
    color: #000;
    border-bottom: 1px solid;
    font-size: 12px;
}
.margin-top-25.deactivate-link-wrapper {
    position: absolute;
    bottom: 25px;
    left: 0;
    right: 0;
    text-align: center;
    display: block;
}
.send-mess-btn-wrapper {
    margin: 15px auto 0px;
}
form.send-and-save-feedback-deactivate textarea#message-text {
    min-height: 220px;
    max-height: 220px;
    margin-top:20px;
    overflow-y: auto;
    background: #F5F5F5;
    padding: 3px 10px;
    font-size: 14px;
}
div#deactivate-user-feedback-popup .modal-dialog.modal-dialog-centered {
    max-width: 460px;
}
div#deactivate-user-feedback-popup .modal-body{
   padding-bottom: 0px;
}
.send-mess-btn-wrapper button.send-feedback-message.deactivate-feedback {
    min-width: 160px;
    margin-right: 10px;
}
.location-modal-wrapper.deactivate-user-feedback-wrapper {
    max-width: 100%;
    width: 100%;
}
textarea#message-text:focus {
    border-color: #ddd !important;
}
.location-modal-wrapper.deactivate-user-feedback-wrapper form {
    width: 100%;
    
}
button.btn-primary:disabled, button.btn-primary[disabled] {
    background-color: #1f8a80 !important;
    border-color: #1f8a80 !important;
}
.btn-primary:focus, .btn-primary:hover {
    background-color: #1f8a80 !important;
    border-color: #1f8a80 !important;
    box-shadow: none !important;
}
.message-matches-section h4.green-text{
   /* z-index: 9999 ;*/
}
div#myModaladdGroup .global-members-list {
    margin-top: 5px;
}
.location-help-text {
    font-size: 0.7rem;
    margin-bottom: 5px;
    line-height: 1rem;
}
/* 2nd may changes */
img.refreshicon {
    width: 20px;
}
.centered-align-wrap {
    display: flex;
    justify-content: center;
}
/* 2nd may changes */
/* 6th may changes */
a.customise_tooltip.refresh-link span.customise_tooltiptext {
    bottom: unset;
    width: 89px;
    top: 36px;
    box-shadow: 0px 1px 4px 0px #aeb0b1;
}

a.customise_tooltip.refresh-link span.customise_tooltiptext::after {
    bottom: unset;
    left: unset;
    top: -6px;
    box-shadow: -1px -1px 1px 0px #b9b9b9;
    right: 22px;
}
a.customise_tooltip.refresh-link {
    margin: 0 9px;
}
/* 6th may changes */
/* 30 June Changes */
.match-page-wrapper,.profile-page-wrapper.non-show-inner{
    background-image: linear-gradient(to bottom right, #d2d4eb, #e5d9e2, #f8e3db);
    min-height: 100vh;
}
.row.first-row{
    background: url(../img/bgsignup.png);
    /* padding: 30px 80px; */
    background-size: 100% 100%;
    background-repeat: no-repeat;
    position: relative;
}
.signup-inner {
    /* background: #afafaf; */
}
.signup.container{
    padding: 0px !important;
    background: rgb(222 225 227 / 38%);
    backdrop-filter: saturate(90%) blur(20px);
}
.row.first-row h3.black-text {
    color: #111111;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    min-width: 100%;
    width: 100%;
    top: 28px;
    font-weight: bold;
}
.message-matches-section h4.green-text {
    background-image: linear-gradient(to bottom right, #d2d4eb, #e5d9e2, #d2d4eb);
    margin-right: -20px;
    /*z-index: 999999;*/
}
.blur .signup.container {box-shadow: none;}
/* 16 aug changes */
span.update {
    color: #1f8a80;
    text-decoration: underline;
    font-weight: 600;
    font-size: 15px;
    right: 55px;
    position: absolute;
    top: 10px;
    cursor: pointer;
}
div#emailInput img.cancel-btn {
    float: right;
    padding-top: 15px;
    cursor: pointer;
}
div#emailInput img.email-edit {
    padding-top: 10px;
    width: 20px;
    cursor: pointer;
    float: right;
}
div#emailInput input#email {
    position: relative;
    width: calc(100% - 30px);
    display: inline-block;
}
.signup-inner-bg div#emailInput input#email{
    width: calc(100% - 0px);
    position: unset;
    display:block;
}
.signup.container.about-page-after-login.contact-before-login,.signup.container.edit_profile_wrapper.about-page-after-login.contact-after-login {
    background: #f3ffff;
    position: fixed;
    top: 0;
    padding-top: 150px;
    bottom: 0;
    left: 0;
    box-shadow: 3px 0px 10px 0px #797777;
    right: 0;
    width: 790px;
    max-width: 790px;
}
.signup.container.about-page-after-login.contact-before-login .col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.back-btn,
.signup.container.edit_profile_wrapper.about-page-after-login.contact-after-login .col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.back-btn{
    padding-right: 10px;
}
.signup.container.about-page-after-login.contact-before-login img.centered-logo{
    margin-top:10px;
}
.signup.container.edit_profile_wrapper.about-page-after-login.contact-after-login img.centered-logo{
    margin-top:150px;
}
@supports (-moz-appearance:none) {
  button.min-max-btn.collapsed::before, button.min-max-btn::before {
  left: -3px;
    }
}

/* Responsive design */
@media (min-width:1921px){
    .multi-text-wrapper {
        display: flex;
        width: 82%;
        justify-content: flex-end;
        align-items: flex-end;
        align-content: flex-end;
    }

    .multiple-photo-upload {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
    }
    .mutiple-image-wrapper {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }
    p.multiple-photo-text{
        text-align: unset;
    }
}
@media (max-width:1867px){
     img.profile-image {
        max-width: 49%;
     }
    img.profile-image {
        max-width: 100%;
        min-width: 100%;
    }
    .signup.container {
        /* background: #f3ffff; */
        /*position: fixed;*/
        top: 0;
        bottom: 0;
        left: 0;
        box-shadow: 3px 0px 10px 0px #797777;
        right: 0;
        width: 790px;
        max-width: 790px;
    }
    .blur .signup.container {box-shadow: none;}
    .how-it-work-wrapper .signup-inner{
        width: 790px;
        max-width: 790px;
    }
    /*to fix the issue of text broken*/
    .multiple-photo-upload {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
    }
}
@media (max-width:2000px){
    .chat-box-content{
        overflow-y: auto;
        max-height: calc(100vh - 480px);
        min-height: calc(100vh - 480px);
        overflow-x: hidden; /*to hide scroll*/
    }
    .chat-window{
        max-height:calc(100vh - 280px);
    }
}
@media (max-width:1441px) and (min-width:1439px){
    .message-buddies-sidebar{
        width: 40%;
        max-width: 40%;
    }
    .message-matches-section{
        width: 60%;
        max-width: 60%;
        left: calc(100% - 60%);
    }
    .message-matches-section h4.green-text{
        left: calc(100% - 60%);
    }
    .profile-page-wrapper.non-show-inner .message-matches-section h4.green-text{
        left:0px;
    }
    .signup-inner {
        padding: 40px 55px;
    }
    .signup.container.about-page-after-login.contact-before-login .signup-inner.contact-inner {
        padding-bottom: 100px;
    }
   /* .message-matches-section .inner-grid.light-orange.white-text:nth-child(6n),
    .message-matches-section .inner-grid.light-orange.white-text:first-child,.message-matches-section .inner-grid.light-orange.white-text:nth-child(5n){
        margin-left: 15px;
        margin-right: 15px;
    }*/
}
@media (max-width:1366px){

    .chat-box-content{
        overflow-y: auto;
        max-height: 285px;
        min-height: 285px;
        overflow-x: hidden; /*to hide scroll*/
    }
    .chat-window{
        max-height:450px;
    }
    .signup.container.about-page-after-login.contact-before-login .signup-inner.contact-inner {
        padding-bottom: 100px;
    }
    .welocome-page {
        padding-bottom: 100px;
    }
    .site-map ul li a {
        color: #000000;
        padding: 0 8px;
    }
    .signup.container.edit_profile_wrapper {
        overflow-y: auto;
        padding-bottom: 50px;
    }
    .message-buddies-sidebar{
        width: 23%;
        max-width: 23%;
    }
    .message-matches-section{
        width: 77%;
        max-width: 77%;
        left: calc(100% - 77%);
    }
    .message-matches-section h4.green-text{
         left: calc(100% - 77%);
    }
    .success-page img.logo{
        margin: 0px auto 50px;
        max-width: 160px;
    }
    img.accept-button {
        width: 70px;
        margin-bottom: 30px;
    }
    img.profile-image-small,img.profile-image{
        /*margin-bottom: 10px;*/
    }
    img.profile-image-small{
        max-width: 90px;
    }
   /* .inner-grid.light-orange.white-text:nth-child(6n), .inner-grid.light-orange.white-text:first-child {
        margin-left: 15px;
    }*/
   /* .inner-grid.light-orange.white-text:nth-child(5n) {
        margin-right: 15px;
    }*/
    .row.slide-container .slide-column.profile-image-wrapper{
        width: 100%;
        height: 100%;
        min-width: 100%;
        display: block;
        object-fit: cover;
        min-height: 100%;
        text-align: center;
        margin: 0 auto 15px;
    }
    .below-grid{
        margin: 0 15px;
    }
    .row.slide-container .below-grid .slide-column{
        margin-bottom: 5px;
        width: 44px;
        max-width: 44px;
        height: 44px;
        max-height: 44px;
    }
    .welocome-page img.logo{
       margin: 30px auto 20px; 
    }
    h3.welcome-page-text{
        line-height: 1.3;
    }
}
@media (max-width: 1200px){
     .reactivate-screen-inner img.logo-img {
        max-width: 180px;
        margin: 50px auto 20px auto;
    }
    .how-it-work-wrapper .signup-inner {
        width: 100%;
        max-width: 100%;
    }
    .match-page-wrapper, .profile-page-wrapper.non-show-inner, .Search-page-inner, .Search-page-inner, .profile-page-wrapper{
            padding-top: 106px;
    }
    .green-colored-bg.message-buddies-sidebar{
        top:120px;
    }
    .message-buddies-sidebar{
        top: 136px;
        min-height: calc(100vh - (119px + 48px));
        max-height: calc(100vh - (119px + 48px));
    }
    
    .message-buddies-sidebar{
        width: 28%;
        max-width: 28%;
    }
    .message-matches-section h4.green-text{
        left: calc(100% - 72%);
        margin-top: 0px;
    }
    .profile-page-wrapper.non-show-inner .message-matches-section h4.green-text{
        left:0px;
    }
    .message-matches-section {
       width: 72%;
        left: calc(100% - 72%);
        max-width: 72%;
    }
    /* .profile-page-wrapper.non-show-inner .message-matches-section h4.green-text{
        top: 120px;
    } */
    /* .profile-page-wrapper.non-show-inner .message-matches-section{
        padding-top: 30px;
    } */
}
@media (max-width:1650px) and (min-width: 1366px){
        .profile-page-wrapper.my-profile .inner .col-lg-2.col-md-2.col-sm-12.col-xs-12 {
            flex: 0 0 20%;
            max-width: 20%;
        }
        .col-lg-10.col-md-10.col-sm-12.col-xs-12.profile-page-inner {
            flex: 0 0 80%;
            max-width: 0 0 80%;
        }
        a.customise_tooltip.img-btn.gain-tooltip+span.customise_tooltiptext.yourself {
            top: 48px;
            right: 22px;
            left: unset;
        }

        a.customise_tooltip.img-btn.gain-tooltip+span.customise_tooltiptext.yourself:after {
            left: unset;
           right: 34px;
    }
}
@media (max-width:1200px) and (min-width: 768px){
        .profile-page-wrapper.my-profile .inner .col-lg-2.col-md-2.col-sm-12.col-xs-12 {
            flex: 0 0 25%;
            max-width: 25%;
        }
        .col-lg-10.col-md-10.col-sm-12.col-xs-12.profile-page-inner {
            flex: 0 0 75%;
            max-width: 0 0 75%;
        }
}
@media (max-width:1024px){
    .margin-top-25.deactivate-link-wrapper{
        bottom: 65px; /*to fix safari issue*/
    }
    span.show-visitor,span.show-visitor-fav{
        height: 26px;
        padding-top: 3px;
    }
    i.emoji-picker-icon.emoji-picker.fa.fa-smile-o {
        /*left: calc(100% - 37px) !important;*/
    }

    img.user-grid-img{
        max-width: 100px;
        max-height: 100px;
        min-height: 100px;
        min-width: 100px;
    }
    .inner-grid a img+h4{
        margin-top: 5px;
    }
    .signup.container.edit_profile_wrapper {
        top: 120px;
    }
    button.message-btn-header img {
        WIDTH: 21PX;
        MAX-WIDTH: 21px;   
    }
    .header-list ul li a img {
        width: 21px;
        max-width: 21px;
    }
    button.message-btn-header{
        /*font-size:13px;*/
    }
    .header-list ul li{
         /*font-size:13px;*/
    }
    header .right-align-wrapper {
        margin-left: -20px;
    }
    .fixed-footer,header{
        padding: 12px 15px;
    }
    .header-list ul{
        margin:0 10px 0 0;
    }
    h3.orange-text.page-headings {
        font-size: 22px;
    }
    .signup.container {
        width: 700px;
        max-width: 700px;
    }
    .signup-inner {
        padding: 40px 20px;
    }
    .search-page-inner .width-define-container{
        width: 700px;
        max-width: 700px;
    }
    img.profile-image {
        max-width: 131px;
    }
    .header-list ul li {
        margin-right: 5px;
    }
    .header-list ul p {
        /*font-size: 14px;*/
    }
    img.header-logo{
        margin:5px 0px;
    }
    .match-page-wrapper, .profile-page-wrapper.non-show-inner, .Search-page-inner, .Search-page-inner, .profile-page-wrapper{
        padding-top: 106px;
    }
    .signup.container.about-page-after-login.contact-before-login,.signup.container.edit_profile_wrapper.about-page-after-login.contact-after-login {
        width: auto;
        max-width: 90%;
    }
}
@media(max-width:1000px){
    .inner-grid a.restore-btn{
        font-size: 14px;
    }
    .site-map ul li a,.copy-right-para p {
        font-size: 14px;
    }
    .message-buddies-sidebar{
        width: 270px;
        max-width: 270px;
    }
    .message-matches-section {
        width: calc(100% - 270px);
        max-width: calc(100% - 270px);
        left: 270px;
    }
    .message-matches-section h4.green-text{
        left:270px;
    }
    .inner-grid a img+h4 {
        max-width: 140px;
        width: 140px;
    }

    .inner-grid {
        max-width: 180px;
        width: 180px;
    }

    .tooltip {
        width: 153px;
    }
}
@media(min-width: 768px){
    .search-page-inner .third-section .col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-xs-12.custom-multiselect-wrapper.remove-capitalise .width-define-container ,
    .search-page-inner .second-section .col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-xs-12.custom-multiselect-wrapper.remove-capitalise .width-define-container,
    .search-page-inner .first-section .col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-xs-12.custom-multiselect-wrapper .width-define-container{
        padding-left: 109px;
    }
}
@media (max-width:767px){
    .profile-page-wrapper.non-show-inner .message-matches-section h4.green-text {
        top: 95px;
        padding-left: 20px;
    }
    .filter-inner {
        bottom: 64px;
    }
    span.update {
        /* color: #1f8a80;
        text-decoration: underline;
        font-weight: 600;
        font-size: 12px;
        right: 51px;
        position: absolute;
        top: 13px;
        cursor: pointer; */
        /* color: #1f8a80;
        text-decoration: underline;
        font-weight: 600;
        font-size: 0px;
        background: url(../img/tick.png);
        right: unset;
        position: absolute;
        top: -28px;
        cursor: pointer;
        left: 70px;
        width: 18px;
        background-size: 100%;
        height: 18px; */
        color: #1f8a80;
        text-decoration: underline;
        font-weight: 600;
        font-size: 14px;
        right: 77px;
        position: absolute;
        top: -25px;
        cursor: pointer;
        width: 18px;
        background-size: 100%;
        height: 18px;
    
    }
    /* div#emailInput img.cancel-btn {
        float: right;
        padding-top: 0;
        cursor: pointer;
        max-width: 11px;
        margin-top: -17px;
        position: absolute;
    }
    div#emailInput input#email{
        width: calc(100%);
    }
    div#emailInput img.email-edit {
        padding-top: 0;
        width: 12px;
        cursor: pointer;
        float: right;
        margin-top: -20px;
    } */
    button.btn.btn-primary.send-feedback-message.deactivate-feedback {
        margin: 5px auto 10px;
        /*min-width: 220px;*/
    }
    .margin-top-25.deactivate-link-wrapper{
        position: unset;
        margin-top: 0;
        text-align: left;
        padding-left: 15px;
    }
    a.reactivate-account {
        font-size: 16px;
    }
    .body-bg.reactivate-screen h2.green-text {
        font-size: 20px;
    }
    .body-bg.reactivate-screen h2.green-text+h3.reactivate-text {
        font-size: 16px;
    }
    .body-bg.reactivate-screen .continue-btn.margin-top-50 {
        margin-top: 25px;
    }
    a.logout-link, a.logout-link:hover, a.logout-link:focus {
        font-size: 16px;
    }
    .reactivate-screen-inner img.logo-img {
        max-width: 100px;
        margin: 50px auto 20px auto;
    }
    .apply-close-btn.hidden-on-mobile {
        display: none;
        
    }
    .shown-only-mobile.apply-close-btn a.clear-filter-btn {
        background: #f2f2f2;
        color: #333333;
        text-align: center;
        display: inline-block;
        width: 49%;
        float: right;
    }
    .shown-only-mobile{
        display: block;
        margin-top: -8px;
        margin-bottom: 5px;
    }
    .location-modal-wrapper.locationselectonmap-wrapper .row.select-btn-wrapper{
        align-items: center;
    }
    input#pac-input {
        top: 55px!important;
        right: unset !important;
        left: 10px !important;
        width:191px;
    }
    span.show-visitor{
        height: 24px;
        padding-top: 0px;
    }
   
    .send-btn-wrapper {
        max-width: 300px;
        width: 300px;
    }
    a.cancel-btn.edit-profile-btn,.row.mail-delete-btn-wrapper a.cancel-btn,.row.mail-delete-btn-wrapper a {
        z-index: 99;
    }
    ul.grey-text.font-16.custom-list.hobbies-list {
        text-align: left;
    }
    .alert.alert-success.desktop-sucess-msg{
        display: none;
    }
    .alert.alert-success.mobile-sucess-msg {
            display: block;
            margin-left: -15px;
            margin-top: -10px;
            margin-bottom: 15px;
            min-width: calc(100% + 30px);
    }
    .col-lg-10.col-md-10.col-sm-12.col-xs-12.profile-page-inner {
        margin-top: 15px;
    }
    div#locationselectonmap .modal-dialog.modal-dialog-centered {
        min-width: 200px;
    }
    .signup.container.about-page-after-login.contact-before-login {
        padding-bottom: 100px;
    }
    /*.sign-up-back-btns {
      margin: 0;
    }

    .sign-up-back-btns a {
        font-size: 14px;
        float: none;
    }

    .sign-up-back-btns a img {
        width: 15px;
        margin-right: 4px;
    }

    .sign-up-back-btns a {
        display: block;
        width: 100%;
        margin: 5px 0px;
    }

    a.back-btn-tag.flex-end {
        float: none;
        margin-bottom:10px;
    }*/
    .sign-up-back-btns {
        display: flex;
        /* margin: 10px 0px 30px; */
        /* justify-content: flex-start; */
        justify-content: space-between;
    }
    .row.first-row h3.black-text {
        top: unset;
        position: unset;
        padding-top: 20px;
        font-size: 20px;
    }
    .row.first-row{
        background-size: 100% 50%;
    }
    .signup.container img.centered-logo {
        margin: -180px auto 35px;
        max-width: 100px;
    }
    .col-xxl-12.col-xl-12.col-lg-12.col-md-12.col-sm-12.col-12.full-width.newsletter-edit-profile {
        margin-top: 20px;
    }
    .body-bg.successful-body-bg .success-page a.primary-link {
        min-width: auto;
        font-size:16px;
    }
    h3.success-page-text {
       width: 80%;
       max-width:80%;
        margin: 10px auto;
        font-size: 16px;
        text-align: center;
        padding: 0 15px;
    }
    .success-page h2.orange-text {
        font-size: 22px;
        padding: 0 15px;
    }
    .buttons-wrap {
        display: block;
        margin: 50px auto;
        justify-content: center;
    }
    .welocome-page form.login_form_submit .login-btn-wrapper button{
        margin: 20px auto 10px;
    }
    .buttons-wrap a.btn.btn-primary.join-piper-link{
        margin: 20px auto 10px;
        display: block;
        max-width: 160px;
    }
    a.customise_tooltip.img-btn {
        display: none;
    }
    .search-page-inner form.search_form_submit .invalid-feedback {
        margin-left: 15px;
    }
    #map {
        min-height: 300px;
        max-width: 100%;
    }
    .modal.lightbox .mySlides img{
        max-width: 400px;
        max-height: 400px;
    }
    .mobile-menu-list.dropdown-menu a.dropdown-item:active {
        background: transparent;
        color: #1f8a80;
    }
    .profile-page-wrapper.non-show-inner .message-matches-section{
        overflow-x:unset;
    }
    /*for match page only*/
    .message-matches-section.match-page-listing-scroll {
        left: 0;
        padding-left: 15px;
        padding-right: 15px;
    }
    /* .message-matches-section h4.green-text {
        left: unset;
        position: unset;
    } */
    .message-buddies-sidebar {
        position: unset;
    }

    .message-match-sec-inner.matches_list {
        padding-top: 0;
    }
    /*for match page only*/
    .card h6.center-align{
        width:80%;
    }
    /*forgot password popup*/
    form.forgot_password_submit .form-group.row.margin-top-30 {
        margin-top: 0;
    }
    .search-page-inner .centerise-btn-wrapper.location-wrapper h5.center-align.bold-fonts {
        font-size: 18px;
        text-align: left;
    }
    .search-page-inner .centerise-btn-wrapper.location-wrapper{
        max-width: 100%;
        padding-left: 24px;
    }
    .search-page-inner .custom-multiselect-wrapper {
        padding: 10px 0px;
    }
    .inline-btn-wrapper a.btn.btn-primary.border-btn{
        min-width: 140px;
        max-width: 140px;
        font-size: 16px;
        color: #1f8a80;
        background: #ffffff;
        display: block;
        margin: 10px auto 20px;
    }
    .profile-page-wrapper.non-show-inner,.Search-page-inner,.Search-page-inner, .profile-page-wrapper{
        /*padding-top: 110px;*/
            padding-top: 90px;
        padding-bottom: 50px;
    }
    a.customise_tooltip.img-btn:hover+span.customise_tooltiptext.yourself {
      visibility: hidden;
      opacity: 0;
      transition: opacity 0.3s;
    }
    button.message-btn-header{
        font-size: 16px;
    }
    /* .message-matches-section h4.green-text,.green-colored-bg.message-buddies-sidebar h4.white-text{
        padding-left: 0px !important;
    } */
    .story-img-wrapper {
        flex-wrap: nowrap;
        max-height: unset;
        margin:10px 0px;
    }
    img.story-img-3 {
        max-width: 240px;
        margin: 8px auto;
    }
    img.story-img-1, img.story-img-2 {
        max-width: 240px;
        margin: 8px auto;
    }
    .signup.container.edit_profile_wrapper{
        top:93px;
    }
    .copy-right-para p {
        text-align: center;
    }
    .story-page,.t_and_c,.guidelines,.story-page{
        padding-bottom: 100px;
    }
    .signup.container.edit_profile_wrapper {
        overflow-y: auto;
        padding-bottom: 100px;
    }
    .signup-inner.contact-inner{
        width: 100%;
        padding:10px;
    }
    .signup-inner.contact-inner .form-group.row.contact-math-captcha .col-lg-7.col-md-7.col-sm-7.col-xs-7.captcha-wrapper {
        margin-right: 15px;
        font-size: 0px;
    }
    span#chatBoxUserName {
        max-width: 80px;
        white-space: nowrap;
        width: 80px;
        vertical-align: middle;
        overflow: hidden;
        text-transform: capitalize;
        text-overflow: ellipsis;
        display: inline-block;
    }
    header{
        padding: 0 15px;
    }
    .chat-window {
        right: 0;
        z-index: 99999999999;
        max-width: 300px;
        bottom: 0px;
        width: 100vw;
        width: 100vw !important;
        max-width: 100vw !important;
        max-height: unset;
    }
    .message-inner-test .message-box {
        max-height: calc(100vh - 200px);
        min-height: calc(100vh - 200px);
        height: calc(100vh - 200px);
    }
    .filter-box {
        max-height: auto;
        min-height: auto;
        height: calc(100vh - 77px);
    }
    div#locationmodal label.custom-checkbox {
         font-size: 14px;
    }
    .location-modal-wrapper .row.yes-no-btn-wrapper {
        margin: 10px;
    }
    .location-modal-wrapper .row.yes-no-btn-wrapper button.btn.btn-primary {
        min-width: 40px;
    }
    div#locationmodal label.custom-checkbox .checkmark {
        width: 14px;
        height: 14px;
    }
    div#locationmodal .checkmark:after {
        left: 3px;
        top: -1px;
        width: 4px;
        height: 10px;
    }
    .location-modal-wrapper h5.black-small-font {
        font-size: 17px;
    }
    /*to define no data at center*/
    .no-data{
        min-width: 90vw;
    }
    /*to hide hover*/
    .customise_tooltip:hover .customise_tooltiptext{
        visibility: hidden;
    }
    .mobile-menu-list.dropdown-menu.show button.message-btn-header img {
        display: inline-block;
        margin-right: 5px;
        width: 20px;
        /*vertical-align: middle;*/
        vertical-align: text-top;
    }
    
    .mobile-menu-list.dropdown-menu.show button.dropdown-item.message-btn-header.present:after {
        right: unset !important;
        left: 30px !important;
    }
    
    .mobile-menu-list.dropdown-menu.show button.message-btn-header {
        padding: 0rem 1.5rem .25rem 1rem;
    }
    
    .message-matches-section span.right-align-button {
        margin-top: -3px;
    }
    .welocome-page h2 {
        font-size: 20px;
    }
    .welocome-page .col-lg-12.col-md-12.col-sm-12.col-xs-12.margin-top-20 {
        margin-top: 0;
    }
    .welocome-page .inline-btn-wrapper {
        margin-top: 5px;
    }
    .fixed-footer{
        padding:10px;
    }
    .welocome-page img.logo {
        max-width: 120px;
        margin: 15px auto;
    }
    /* .profile-page-wrapper.non-show-inner .message-match-sec-inner {
        margin-left: 0;
        display: flex;
        justify-content: center;
    } */
    .row.mail-delete-btn-wrapper a{
        /*margin-left: 0;
        margin-right:15px;*/
    }
    .header-list ul {
      margin: 0 10px 0 0;
    }
    .header-list ul li {
        margin-right: 5px;
    }
    .header-list ul li a img {
        width: 25px;
        max-width: 25px;
    }
    .header-list ul p {
        font-size: 14px;
    }
    .profile-page-inner .row.page-heading-wrapper{
        max-width: calc(100% + 15px);
        margin-right: 0;
    }
    .row.mail-delete-btn-wrapper {
        right:25px;
   }
    .profile-page-inner .row.page-heading-wrapper h3.orange-text.page-headings {
        font-size: 20px;
        margin-right: -15px;
        padding-right: 0;
        margin-top: 40px;
    }
    .row.mail-delete-btn-wrapper a.cancel-btn {
       /* margin-left: 0;*/
    }
    a.other-user-btn {
        margin-left: 12px;
    }
    .other-pics {
        justify-content: center;
        margin: 10px;
    }

    img.profile-image-small {
        margin: 0px 0px;
         /*max-width: 150px;*/
    }
    img.profile-image {
        /*max-width: 300px;
        min-width: 300px;*/
    }
    .site-map{
        justify-content: center;
    }
    .shown-on-mobile.show .dropdown-menu.show {
        transform: translate3d(62px, 50px, 0px) !important;
    }
    /*.mobile-header-list.dropdown-menu.show {
        transform: translate3d(62px, 50px, 0px);
    }*/
    img.profile-image {
        margin: 0 auto;
        display: block;
    }
    a#mobileDropdown {
        color: #333;
        padding: 0;
        display: inline-block;
        /*float: right;*/
    }
    a#mobileDropdown.dropdown-toggle::after {
        color: #1f8a80;
    }
    
    .mobile-header-list.dropdown-menu.show a.dropdown-item {
        display: flex;
        flex-wrap: wrap;
        height: auto;
    }
    
    .mobile-header-list.dropdown-menu.show a.dropdown-item img {
        width: 26px;
        height: 24px;
        margin-right: 10px;
    }
    
    .mobile-header-list.dropdown-menu.show a.dropdown-item p {
        margin-bottom: 0;
    }
    header .col-lg-4.col-md-4.col-sm-5.col-xs-5.header-logo {
        width: 30%;
        max-width: 30%;
        flex: 0 0 30%;
    }
    
    .col-lg-8.col-md-8.col-sm-7.col-xs-7.shown-on-mobile {
        width: 70%;
        max-width: 70%;
        flex: 0 0 70%;
    }
    ul.custom-list li{
        /*display: block;
        position: relative;
        width: 100%;
        padding-left: 15px;
        list-style: none;
        max-width: 100%;*/
    }
    .shown-on-mobile{
        display: block;
    }
    header .right-align-wrapper.shown-desktop {
        display: none;
    }  
    .captcha-wrapper {
        background: #bbbbbb;
        border-radius: 6px;
        margin-left: 15px;
        width: 93%;
        max-width: 93%;
        min-width: 75%;
        margin-bottom: 10px;
    }
    .site-map ul li:last-child a{
        padding-right: 7px;
    }
    .radiobox-container {
        width: 100%;
    }
    .image-upload{
        margin-bottom: 0px;
        margin-right: 0px;
        max-width: 105px;
        min-width: 105px;
        /*margin-left: 28px;*/
    }
    .label-wrapper{
        width: 100%;  
    }
    .mutiple-image-wrapper {display: block;}

    .multi-text-wrapper {
        display: block;
        margin: 0 auto;
    }

    .multiple-photo-upload {
       display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    .image-upload:nth-child(2n) {
        margin-right: 0px;
    }
    .profile-photo-upload {
        position: relative;
        max-width: 200px;
        margin: 0 auto 30px;
    }
    .signup.container {
        /* background: #f3ffff; */
        /*position: fixed;*/
        top: 0;
        bottom: 0;
        width: 80%;
        left: 10%;
        box-shadow: 3px 0px 10px 0px #797777;
        right: 10%;
        max-width: 80%;
    }
    .copy-right-para p {
        text-align: center;
    }
    .site-map ul li a {
        color: #000000;
        padding: 0 7px;
    }
    .body-bg,.successful-body-bg{
        background-size: cover;
    }
    .inline-btn-wrapper button.btn.btn-primary {
        font-size: 15px;
        font-weight: bold;
        margin: 0px 6px;
        text-transform: capitalize;
        min-width: 109px;
    }
    .welocome-page h1 {
        font-size: 22px;
    }
    h3.welcome-page-text{
        line-height: 1.4;
        font-size: 16px;
        max-width: auto;
    }
    .happy_wrapper label.radiobox-container{
        min-height: 30px;
        width:100%;
    }
    .age-group-wrapper label.radiobox-container, .gender-group-wrapper label.radiobox-container{
        width:100%;
    }
    .copy-right-para p{
        font-size: 14px;
    }
    .site-map ul li {
        display: inline-flex;
        font-size: 15px;
    }
    .search-page-inner .width-define-container{
        width: 100%;
        max-width: 100%;
        padding-left: 10px;
       /* padding-bottom: 70px;*/
    }
    .search-page-inner .width-define-container h5.center-align.bold-fonts {
        text-align: left;
        font-size: 18px;
    }
    .search-page-inner .custom-multiselect-wrapper .label-wrapper{
        width:100%;
        max-width: 100%;
        padding-left: 13px;
    }
    a#mobileMenu {
        display: inline-block;
        padding: 10px 0px 10px 20px;
    }
    .col-lg-8.col-md-8.col-sm-7.col-xs-7.shown-on-mobile {
        justify-content: flex-end;
        display: flex;
        align-content: center;
        align-items: center;
    }
    a#mobileMenu img {
        width: 26px;
    }

    a#mobileMenu:after {
        display: contents;
    }
    .mobile-menu-list.dropdown-menu a.dropdown-item{
        padding: 0rem 1.5rem .25rem 1rem;
        display:flex;
    }
    .mobile-menu-list.dropdown-menu.show a img {
        width: 20px;
        height:21px;
        vertical-align:middle;
        margin-right:5px;
    }
    .mobile-menu-list.dropdown-menu a.dropdown-item p{
        margin-bottom:0;
    }

    .mobile-menu-list.dropdown-menu.show {
       padding: 15px 0px;
        transform: none !important;
        left: auto !important;
        right: 9px;
        top: 76px !important;

    }
    .mobile-header-list.dropdown-menu.show {
        transform: none !important;
        right: 15px;
        left: auto !important;
        top: 78px !important;
    }
    .message-buddies-sidebar,.message-matches-section{
        /* min-height: auto;
        max-height: 100%; */
        width: 100%;
        max-width: 100%;
    }
    .inner-grid.light-orange.white-text:nth-child(5n){
        margin-right: 15px;
    }
    /*.inner-grid.light-orange.white-text:nth-child(6n), .inner-grid.light-orange.white-text:first-child {
        margin-left: 15px;
    }*/
    /* .message-match-sec-inner,.buddies-sidebar-inner{
        justify-content: center;
    } */
    .message-match-sec-inner {
        margin-top: 55px;
            margin-left: 0 !important;
    }
    .green-colored-bg.message-buddies-sidebar .buddies-sidebar-inner{
        display: flex;
        flex-wrap: wrap;
    }
    div#locationmodal .modal-content {
        width: 300px;
        margin: 0 auto;
    }
    .no-data {
        min-width: 80vw;
        height: auto;
        min-height: calc(100vh - (119px + 128px));
    }
    .location-modal-wrapper {
        max-width: 90%;
    }
    button.min-max-btn.customise_tooltip.collapsed:hover span.customise_tooltiptext.max,
    button.min-max-btn.customise_tooltip:hover span.customise_tooltiptext.min{
        visibility: hidden;
    }
    .inner-grid a.restore-btn {
        font-size: 14px;
    }
    .site-map ul li a {
        color: #000000;
        padding: 0 3px;
        font-size: 14px;
    }
    .popover-body {
        max-width: 160px;
    /*max-width: 240px;*/
    }
    .row.slide-container .slide-column.profile-image-wrapper {
        width: 240px;
        height: 240px;
        min-width: 240px;
        display: block;
        object-fit: cover;
        min-height: 240px;
        text-align: center;
        margin: 0 auto;
    }
    .row.slide-container{
        max-width: 330px;
    }
    .below-grid{
        margin:10px auto;
    }
    .profile-page-wrapper.my-profile .inner .col-lg-2.col-md-2.col-sm-12.col-xs-12{
        min-height: 100%;
    }
    .profile-page-inner {
        padding-left: 0;
        padding-right: 0;
    }

    .profile-page-inner-wrapper {
        min-height: auto;
        margin-bottom: 60px;
    }
    ul.grey-text.font-16.custom-list.hobbies-list li ul.sub-cat-list li,ul.sub-cat-list{
        line-height: 1.0;
    }
    .row.slide-container .slide-column img.profile-image-small {
        object-fit: cover;
        width: 100%;
        margin: 0;
        max-width: 100%;
    }
    .profile-page-wrapper.non-show-inner .message-matches-section{
        padding-top: 0px;
    }
    .match-page-wrapper{
        padding-bottom: 100px; 
        padding-top: 90px;
    }
    /*how it works page design*/
    .how-it-works-sec{
        margin: 70px 0px;
    }
    .how-it-works-sec.first-sec, .how-it-works-sec.third-sec,.how-it-works-sec.fifth-sec {
        flex-direction: column-reverse;
    }

    .how-it-works-sec.second-sec,.how-it-works-sec.fourth-sec {flex-direction: column;}

    .first-sec .img-sec+.text-sec .inner-content, .third-sec .img-sec+.text-sec .inner-content, .fifth-sec .img-sec+.text-sec .inner-content {
        margin-bottom: 10px;
        min-width: 340px;
        max-width: 340px;
        width: 340px;
        background: url(../img/bg4.png);
        background-size: 100%;
        background-repeat: no-repeat;
        padding: 0;
    }

    span.small-icon img,.second-sec .text-sec .inner-content span.small-icon img, .fourth-sec .text-sec .inner-content span.small-icon img {
        left: 3px;
        bottom: unset;
        right: unset;
        top: 16px;
        width: 60px;
        margin-left: 7px;
        margin-right: 7px;
    }

    .second-sec .text-sec .inner-content, .fourth-sec .text-sec .inner-content {
        margin-bottom: 10px;
        min-width: 340px;
        max-width: 340px;
        width: 340px;
        background: url(../img/bg3.png);
        background-size: 100%;
        background-repeat: no-repeat;
        padding: 0;
    }
    .how-it-works-sec .inner-content p{
        margin-bottom: 10px;
        padding-left: 80px;
        padding-right: 20px;
    }
    .how-it-work-wrapper{
         padding-bottom: 100px;   
    }
    .mobile-menu-list.dropdown-menu.show button.dropdown-item.message-btn-header.present:after {
        right: unset !important;
        left: 30px !important;
    }
    /*i.emoji-picker-icon.emoji-picker.fa.fa-smile-o{
        margin-right: 5px;
    }*/
    .emoji-picker-icon.emoji-picker.fa.fa-smile-o {
        position: absolute;
        right: 9px;
        margin-right: 0;
    }
    button#btnSend {
        position: relative;
    }
    i.emoji-picker-icon.emoji-picker.fa.fa-smile-o {
        /*left: calc(100% - 37px) !important;*/
    }
    .chat-box-content {
        max-height: calc(100dvh - 178px);
        min-height: calc(100dvh - 178px);
    }
    .sign-up-back-btns{
        padding: 0px 30px 100px;
        z-index:999999;
    }
    .signup.container.edit_profile_wrapper .signup-inner{
        padding-bottom:100px;
    }
    .signup.container.edit_profile_wrapper .signup-inner.contact-inner{
        padding-bottom:100px;
    }
    
    /* For Mobile PWA App Change */
    /* .match-page-listing-scroll .inner-grid:nth-child(2n) {
	margin-right: 10px !important;
    } */
    .inner {
        padding: 15px;
    }
    /* .budList .inner-grid:nth-child(2n+1) {
	margin-right: 10px !important;
    } */
    /* .buddies-sidebar-inner.budList {
	overflow-x: hidden !important;
    } */
    .inner-grid {
	width: calc(50% - 10px) !important;
	margin: 05px !important;
	margin-bottom: 10px !important;
	padding: 15px 10px !important;
    }
    .slide-column.profile-image-wrapper {
	padding: 0 !important;
	margin-left: 20px !important;
	margin-bottom: 10px !important;
    }
    .login-btn-wrapper {
	padding: 0 !important;
    /*margin-top: -40px !important;*/
	text-align: center;
    }
    .login-btn-wrapper .buttons-wrap {
        margin-top: 10px;
    }
    .btn.btn-primary.join-piper-link {
	float: left;
    }
    .login-btn-wrapper .btn.btn-primary {
	display: inline-block !important;
    }
    .margin-top-40 {
	margin-top: 20px !important;
    }
    .signup.container {
	width: 90% !important;
	max-width: 90% !important;
    }
    /* .message-matches-section {
	padding: 15px !important;
    } */
    .fixed-footer {
	z-index: 999;
    }
    #msg-box {
	width: 100% !important;
	height: 100% !important;
	top: 0 !important;
    }
    #message-scroll-box {
	height: 100% !important;
	max-height: 100% !important;
    }
    .inner-grid a img + h4 {
	width: 100% !important;
	max-width: 100% !important;
	margin: 10px 0 !important;
    }
    /* For Mobile PWA App Change */
    
}
div#myModaladdGroup {
    z-index: 99999;
    background: #0005;
}
/* responsive css  */

@media only screen and (max-width: 1600px){
    .inner-grid {
        padding: 10px;
        margin: 0px 5px 10px;
        max-width: 190px;
    }
    .message-buddies-sidebar {
        padding: 15px 5px 15px 15px;
    }
    .message-matches-section h4.green-text {
        padding-left: 30px;
    }
    .green-colored-bg.message-buddies-sidebar h4.white-text {
        padding-left: 5px;
    }
    .profile-page-wrapper.non-show-inner .message-matches-section h4.green-text {
        padding-left: 20px;
    }
    
}
@media (max-width:503px){
    button#cropImageBtn {
        margin-left: 12px;
    }
    /* .chat-box-content {
        max-height: calc(100dvh - 52px);
        min-height: calc(100dvh - 52px);
    } */
    .croppie-container .cr-slider-wrap {
        width: 65%;
        margin-right:15px;
    }
    .croppie-container .cr-slider-wrap{
        margin: 15px auto 15px !important;
    }
    #upload-demo {
        padding-top: 65px; 
    }
    p.cropper-text.small-font{
        font-size: 13px;
    }
    /* .send-btn-wrapper {
        position: absolute;
        bottom: -15px;
    } */
    /* i.emoji-picker-icon.emoji-picker.fa.fa-smile-o {
         left:250px;
    }
    .send-btn-wrapper {
        max-width: 275px;
        width: 275px;
    }
   
    .emoji-picker-icon.emoji-picker.fa.fa-smile-o {
        position: absolute;
        right: 9px;
        margin-right: 0;
    } */
    
    .second-sec .text-sec .inner-content, .fourth-sec .text-sec .inner-content,
    .first-sec .img-sec+.text-sec .inner-content, .third-sec .img-sec+.text-sec .inner-content,
    .fifth-sec .img-sec+.text-sec .inner-content{
        min-width: 300px;
        max-width: 300px;
        width: 300px;
    }
     .row.slide-container{
        max-width: 300px;
    }
    .modal.lightbox .mySlides img{
        max-width: 280px;
        max-height: 280px;
    }
    .mobile-header-list.dropdown-menu.show {
        padding: 0;
    }
    .mobile-header-list.dropdown-menu.show a.dropdown-item {
        padding: .25rem .5rem;
        line-height: 1.3;
    }
    a#mobileMenu img {
        width: 18px;
    }
    img.admin-img {
        width: 40px;
        max-width: 40px;
        height: 40px;
    }
    img.story-img-3 {
        max-width: 200px;
        margin: 8px auto;
    }
    img.story-img-1, img.story-img-2 {
        max-width: 200px;
        margin: 8px auto;
    }
    .site-map {
        justify-content: center;
        align-items: center;
        text-align: center;
    }
     .profile-page-wrapper {
        padding-bottom: 100px;
    }
    .Search-page-inner{
        padding-bottom: 70px;
    }
    .message-inner-test .message-box {
        max-height: calc(100vh - 200px);
        min-height: calc(100vh - 200px);
        height: calc(100vh - 200px);
    }
    .message-inner-test .message-box{
        bottom: 60px;
    }
    .filter-box {
        height: calc(100vh - 300px);
    }
    .chat-window{
        bottom:0px;
    }
    .message-inner-test{
        bottom:0px;
    }
    .filter-inner{
        bottom: 61px;
        top: auto;
    }
    .location-wrapper-inner{
        display: block;
    }
    .search-page-inner div#sliderContainer {
        width: 60%;
    }
    .location-wrapper-inner label.radiobox-container {
        width: 100%;
    }
    .search-page-inner .range-slider{
        margin: 10px auto 20px;
    }
    .site-map ul li {
        display: inline-flex;
        font-size: 14px;
    }
    .search-page-inner {
        width: 100%;
        max-width: 100%;
    }
    div#sliderContainer {
        width: 53%;
        display: inline-block;
    }
    span.min-value {
        font-size: 12px;
        margin-right: 5px;
    }
    span.max-value {
        font-size: 12px;
        margin-left: 5px;
    }
    .tick-slider-value>div:before,.tick-slider-value>div:after,.tick-slider-value:after{
            font-size: 12px;
    }
    img.profile-image-small {
        margin: 10px 5px;
        max-width: 150px;
    }
    .how-it-work-wrapper{
         padding-bottom: 100px;   
    }
    .site-map ul li a,.copy-right-para p{
        font-size:12px;
    }

}

@media (max-width:320px){
     .message-inner-test .message-box {
        max-height: calc(100vh - 180px);
        min-height: calc(100vh - 180px);
        height: calc(100vh - 180px);

    }
}
@media (max-width:767px){   
    .emoji-wysiwyg-editor.send-btn {
        width: calc(100% - 60px) !important;
    }
    .modal-content .login-btn-wrapper {
        margin-top: 0 !important;
    }
    .no-data.no_matches p.location-help-text {
        text-align: center;
    }
    .profile-page-wrapper.my-profile .inner {
        padding-left: 40px;
        padding-right: 40px;
    }
    .message-matches-section.match-page-listing-scroll h4.green-text {
        top: 0;
        position: absolute;
        left: 0;
        padding-left: 20px;
        margin: 0 !important;
        width: 100%;
    }
    
    .message-matches-section.match-page-listing-scroll {
        position: relative;
    }
    i.emoji-picker-icon.emoji-picker.fa.fa-smile-o {
        right: 17.5px !important;
        width: 30px;
    }
    button#btnSend {
        position: absolute;
        right: 15px !important;
        padding: 0 !important;
        width: 30px;
        top: 10px !important;
    }
}
@media (max-width:420px){ 
    .filter-inner{
        bottom: 84px;
    }  
    .send-btn-wrapper {
        max-width: 100%;
        width: 100%;
    }
  button#cropImageBtn {
        margin-left: 5px !important;
    }
    .croppie-container .cr-slider-wrap {
        width: 65% !important;
        margin-right:15px !important;
    } 
    form.change_password_submit .inline-btn-wrapper.create-pass button.btn.btn-primary {
        font-size: 12px !important;
    }
    form.change_password_submit .col-lg-12.col-md-12.col-sm-12.col-xs-12.inline-btn-wrapper.create-pass {
        margin-top: 12px !important;
        padding:0 !important;
    }    
    .signup-inner.contact-inner .g-recaptcha {
        transform: scale(0.7);
        margin-left: -30px;
        text-align: left;
    } 
}

.tag-section-list {
  background-color: #f3f3f3;
  position: absolute;
}

ul#user-mention-list .menu-item {
  cursor: default;
  padding: 1rem;
}

ul#user-mention-list .menu-item.selected {
  background-color: slateGray;
  color: white;
}

ul#user-mention-list .menu-item:hover:not(.selected) {
  background-color: #fafafa;
}

.intersection-background{
    background: #ff7f5025 !important;
    border-color: #ff7f5030 !important;
}
.intersection-show-visitor{
    position: absolute;
    top: 5px;
    left: -10px;
    width: 60px;
    padding: 0;
    font-weight: 800;
    height: 24px;
    font-size: 14px;
    border-bottom-left-radius: 12px;
}
.intersect_customise_tooltiptext {
    visibility: visible !important;
}

.tooltip.show {
    visibility: visible !important;
    background: transparent;
    box-shadow: none;
}
.tooltip-inner {
    background: #fff;
    color: #000;
}
.bs-tooltip-auto[x-placement^=top] .arrow::before, .bs-tooltip-top .arrow::before {
    border-top-color: #fff;
}
.loading-body{
    overflow: hidden;
}
#hint-message{
    color: red; font-size: 90%; margin-top: -20px;
}
.box-4-img{
    margin: 0 20px;
}
button.dropdown-item.message-btn-header {
    padding: 0.25rem 0.5rem;
    line-height: 1.3;
}