@import url('https://fonts.googleapis.com/css?family=Lemonada:300,400,700');
@import url('https://fonts.googleapis.com/css?family=Patrick+Hand');
@import url('https://fonts.googleapis.com/css?family=Neucha');
@font-face {font-family: "ITC American Typewriter";
    src: url("https://db.onlinewebfonts.com/t/bf9940413066bf65037e293ebc4c068e.eot"); /* IE9*/
    src: url("https://db.onlinewebfonts.com/t/bf9940413066bf65037e293ebc4c068e.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
    url("https://db.onlinewebfonts.com/t/bf9940413066bf65037e293ebc4c068e.woff2") format("woff2"), /* chrome firefox */
    url("https://db.onlinewebfonts.com/t/bf9940413066bf65037e293ebc4c068e.woff") format("woff"), /* chrome firefox */
    url("https://db.onlinewebfonts.com/t/bf9940413066bf65037e293ebc4c068e.ttf") format("truetype"), /* chrome firefox opera Safari, Android, iOS 4.2+*/
    url("https://db.onlinewebfonts.com/t/bf9940413066bf65037e293ebc4c068e.svg#ITC American Typewriter") format("svg"); /* iOS 4.1- */
}

/**** City Choise Popup Window Styles ****/
#cityChoicePopUpContainer {
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow-y: auto;
}

#cityChoicePopupBackgroundCover {
    position: fixed;
    opacity: .5;
    background-color: black;
    width: 100%;
    height: 100%;
}

#choseCityContainer {
	font-family: Arial;
	width: auto;
    height: auto;
    padding: 3px 10px 12px 10px;
    background: white;
    border-radius: 14px;
	box-shadow: 0px 7px 15px 0px black;
}

#choseCityContainer>.ac-sub>.ac-label__level2 {
	font-size: 1.6em;
}

#choseCityContainer > .center {
	font-family: Arial;
    text-align: center;
    font-size: 1.4em;
    font-weight: bold;
    margin: 13px 0px;
    color: #00cbff;
}

#choseCityContainer .ac,
.ac > .ac-text > .ac-sub {
    margin: -5px 0;
}

#closeCityButton {
	position: absolute;
    right: 0;
    top: 0;
    margin: -10px -10px;
    cursor: pointer;
}

#closeCityButton > img {
    width: 27px;
}

.ac-sub-text .ac-text:first-child {
    margin-top: -5px;
}

.ac-sub:checked + .ac-label::after {
  background-color: #fecd79;
}

.ac-sub > .ac-input:checked + .ac-label {
  background-color: #85e2f7;
}

.ac-sub-text {
  background-color: white;
}

.ac-label {
  cursor: pointer;
  display: block;
  padding: 11px;
  color: white;
  font-size: 1.3em;
  font-weight: 700;
  position: relative;
/*   -webkit-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease; */
  background: #f9a51c;
  border-radius: 8px;
  margin: 3px auto;
}

.ac-label, .ac-label__level2 {
    cursor: pointer;
    display: block;
    padding: 11px;
    color: white;
    font-size: 1.3em;
    font-weight: 700;
    position: relative;
    /*   -webkit-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease; */
    background: #f9a51c;
    border-radius: 8px;
    margin: 6px auto;
}

/* .ac-input:checked + label, .ac-label:hover {
  background-color: #233a66cc;
} */

ac-label__level2 {
    padding: 6px 11px;
}

.ac-label__level1 + .ac-text .ac-label__level2 {
	margin: 5px auto;
}

.ac-label__level1 + .ac-text .ac-sub:first-child {
	margin-top: 3px;
}

.ac-label__level1 + .ac-text .ac-sub:last-child {
	margin-bottom: 0;
}

.ac-label__level2 + .ac-sub-text {
	padding: 0;
}

.ac-label:after, .ac-input:checked + .ac-label:after {
  content: "+";
  position: absolute;
  display: block;
  right: 0;
  top: -5px;
  width: 2em;
  height: 100%;
  line-height: 2.25em;
  text-align: center;
  /* background-color: #2a2c79; */
  /* transition: background-color .15s ease-in-out; */
  border-radius: 8px;
}

/* .ac-label:hover:after, .ac-input:checked + .ac-label:after {
  background-color: #484f9e;
} */

.ac-input:checked + .ac-label:after {
  content: "-";
}

.ac-input {
  display: none;
}

.ac-text, .ac-sub-text {
  opacity: 0;
  height: 0;
  margin-bottom: .5em;
  /* transition: opacity .5s ease-in-out; */
  overflow: hidden;
}

.ac-sub {
  margin: 0 0 -6px 0;
}

.ac-input:checked ~ .ac-text, .ac-sub .ac-input:checked ~ .ac-sub-text {
  opacity: 1;
  height: auto;
}

.ac-label__level1::after {
  content: '' !important;
}

.ac-label__level1 {
  font-size: 1.6em !important;
  background-color: #0e2442;
  margin: 5px auto;
  top: 3px;
}

.ac-sub .ac-label {
  color: white;
  background-color: #00cbff;
  border-radius: 6px;
  font-weight: 600;
  padding: .3em 1em;
  /* top: 3px; */
  /* transition-duration: .4s; */
}

.ac-sub .ac-label:checked {
  background-color: #fecd79;
  border-bottom: 1px solid rgb(87, 114, 202);
}

.ac-text > .ac-sub > .ac-sub-text p:first-child {
  margin-top: 6px;
}

.ac-text > .ac-sub > .ac-sub-text p:last-child {
  margin-bottom: 6px;
}

.ac-sub .ac-label:hover {
  background-color: #85e2f7;
  /* transition-duration: .4s; */
}

/* .ac-sub .ac-label:after, .ac-sub .ac-input:checked + .ac-label:after {
  left: 0;
  background: none;
}

.ac-sub .ac-input:checked + label, .ac-sub .ac-label:hover {
  background: none;
} */

.ac-sub-text p a {
  padding: 0 1em 0 2em;
}

.ac-sub-text p {
  margin: 6px 0 4px 0;
  cursor: pointer;
}

.ac-sub-text p a {
  color: #726b28;
  text-decoration: none;
  font-weight: bold;
  font-size: 16px;
}

.ac-sub-text p a:focus {
    outline: none;
}

.ac-sub-text p a:active,
.ac-sub-text p a.current {
    color: #FF4444;
}

#postFormId input#phonenumber {
    width: 100%;
}
/**** City Choise Popup Window Styles END ****/

.categoryLink {
    text-decoration: none !important;
    color: #fff !important;
}

.categoryLink:hover {
    text-decoration: none !important;
    color: #fff !important;
}

.categoryLink:visited {
    text-decoration: none !important;
    color: #fff !important;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.popup-text {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 16pt;
    font-weight: bold;
    color: black;
}

#confirmModal_verification .popup-text {
  color: #5a5a5a;
  margin: 0 15px;
}

#confirmModal_verification .modal-dialog {
    min-width: 376px;
}

#confirmModal_verification .popup-text-blurry {
    word-wrap: break-word;
}

#confirmModal_verification .modal-footer button {
    width: fit-content;
    align-self: center;
}
#confirmModal_verification .modal-footer button h3 {
    margin-top: 0;
}
#confirmModal_verification .modal-footer #close-verification {
    margin-top: 8px;
}

.popup-text-bluecheck {
    color: #2faeea;
    font-style: italic;
}

.popup-text-red {
    color: #c75400;
}

.popup-text-new-device {
    text-transform: uppercase;
    background-color: #f8efce;
    font-weight: normal !important;
    color: #b8af8e;
    padding: 4px 0;
}

#device_verification_submit {
    margin-top: 15px;
}

.question-sign {
    cursor: pointer;
}

.popup-text-blurry {
    color: sandybrown;
    font-weight: normal;
    font-size: 20pt;
}

.popup-text-error {
    font-size: 10pt;
    font-weight: bold;
    color: sienna;
}

#contact-support {
    cursor: pointer;
}

.jsp-env {
    visibility: hidden;
    display: none;
    font-size: 0;
    height: 0;
}

#list {
    margin: 5px 10px -12px 6px;
}

.briefdate {
    font-size: 11pt;
    width: 100%;
    padding: 4px 0px 2px 8px;
    margin: 0px 0px 5px;
    clear: both;
    background: #eafefa;
    color: #000;
    font-weight: bold;
}

.briefpost {
    margin: 0px 0px 19px 0px;
    font-size: 11pt;
}

#deleted_post {
    text-align: center;
    font-family: "Georgia";
    margin: auto;
    color: #d0d0d0;
    padding-top: 50px;
    font-weight: bold;
    font-size: 3em;
}

#loading_image_gif {
    height: 50px;
    max-width: 90%;
    margin: auto;
}

#loading_image_gif_anim {
    opacity: 0;
    color: #a92072;
    font-size: 30px;
    float: left;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: relative;
    margin-right: 16px;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load 1.7s infinite ease, round 1.7s infinite ease;
    animation: load 1.7s infinite ease, round 1.7s infinite ease;
}

#loading_image__gif_text {
    padding-top: 5px;
    font-size: 1em;
    font-weight: bold;
    color: #a92072;
    opacity: 0;
}

@-webkit-keyframes load {
    0% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    5%,
    95% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    10%,
    59% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
    }
    20% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
    }
    38% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
    }
    100% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
}

@keyframes load {
    0% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    5%,
    95% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
    10%,
    59% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
    }
    20% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
    }
    38% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
    }
    100% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
}

@-webkit-keyframes round {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes round {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.listLocation {
    font-size: 11px;
    word-wrap: break-word;
}

#gallerylist {
    margin: 30px 0px 10px 0px;
}

#gallerylist img.ribbon {
    width: 30%;
}

#gallerylist:after {
    display: table;
    content: " ";
    clear: both;
}

.view_buttons_container .nav a {
    color: #958889;
    letter-spacing: 2px;
    font-weight: bold;

}

.view_buttons_container .active {
    background-color: #958889;
}

.view_buttons_container .active a {
    color: #fff;
    font-weight: bold;
}

.header-top-margin {
    margin-top: 38px;
}

.header-top-margin-half {
    margin-top: 19px;
}

/*********** terms and conditions styles Start ***********/
#terms-links-wrapper {
    margin-top: 50px;
    margin-bottom: 30px;
}

#termsandconditions,
#successtermsandconditions
{
    z-index: 1000000000;
    background-color: #FBFEFA;
}

#termsandconditions img#megapersonalsPageHeader {
    margin-top: 12px;
}

#termsandconditions {
    text-align: center;
}

#termsandconditions .privacy ul li a {
    color: #337ab7;
    cursor: pointer;
}

#termsandconditions .h4 {
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 0.07em;
    color: darkgray;
}

#termsandconditions .privacy ul {
    list-style: none;
    text-align: left;
    padding-left: 0;
    margin-bottom: 0;
}

#termsandconditions {
    margin-top: 0;
}

#termsandconditions + footer {
    margin-top: 0;
}

termsLinksPage #termsandconditions .privacy ul li a {
    font-size: 1.125em;
}

#termsContainer {
    height: calc(55vh - 30px);
    color: black;
    overflow-y: scroll;
    border: 4px inset;
    padding: 2px;
    margin: 13px 0;
    font: status-bar;
}

#termsContainer>.h1 {
    font-size: 18px;
}

#termsContainer>.h2 {
    font-size: 17px;
}

#termsContainer>.h3 {
    text-align: left;
    font-size: 17px;
}

#termsContainer .simpleText {
    font-size: 12px;
    margin: 10px 0;
    text-align: justify;
    text-indent: 9px;
}

#termsContainer .red {
    color: red;
    display: inline;
}

#termsContainer .bold {
    font-weight: bold;
    display: inline;
}

#termsContainer .border {
    border: 1px solid black;
    margin: 4px;
    padding: 0 8px;
}

#termsContainer .margin {
    border: 1px solid black;
    margin: 4px;
}

#termsContainer ul>li,
#termsContainer ol>li {
    text-align: justify;
    margin: 9px 0;
}

#termsContainerPage .h1 {
    font-size: 27px;
    font-weight: 700;
}

#termsContainerPage .h2 {
    font-size: 19px;
    font-weight: 600;
    color: darkgrey;
}

#termsContainerPage .h3 {
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    text-indent: 16px;
}

#termsContainerPage .h4 {
    font-weight: bolder;
    text-decoration: underline;
}

#termsContainerPage .simpleText {
    font-size: 16px;
    margin: 10px 0;
    text-align: justify;
    text-indent: 16px;
}

#termsContainerPage .red {
    color: red;
    display: inline;
}

#termsContainerPage .bold {
    font-weight: bold;
    display: inline;
}

#termsContainerPage .border {
    border: 1px solid black;
    margin: 4px;
    padding: 0 8px;
}

#termsContainerPage .margin {
    border: 1px solid black;
    margin: 4px;
    padding: 4px 12px;
}

#termsContainerPage .margin-noborder {
    margin: 4px;
    padding: 4px 30px;
}

#termsContainerPage ul>li,
#termsContainerPage ol>li {
    text-align: left;
    font-size: 16px;
    margin: 12px 0;
}

#termsContainerPage ul[style="list-style: none"] > li {
    margin: 8px 0;
    text-align: justify;
}

/*********** terms and conditions styles End *************/

.view_buttons_container .galnorm,
.view_buttons_container .gallarge {
    width: 45px;
    height: 25px;
    border-radius: 4px;
    padding: 0;
    border: 2px solid #958889;
}

p.viewmode {
    float: right;
    font-size: 10pt;
    color: #b58352;
    line-height: normal;
}

.gallerylistad {
    float: left;
    width: 100%;
    padding: 5px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 1px;
    margin-bottom: 10px;
    position: relative;
    background: #ececec;
}

.gallerylistimage {
    text-align: center;
    overflow: hidden;
    position: relative;
}

.gallerylistad img {
    width: 100%;
    height: auto;

}

.videoIconGallery {
    position: absolute;
    top: -4px;
    left: 0px;
    height: 15px;
    z-index: 1;
    width: 42px;
    height: 15px;
}

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


a.navtext:link {
    text-decoration: none;
}

a.navtext {
    color: #b58352;
    outline: none;
    font-size: 10pt;
}

.videoIconGallery img {
    height: 15px;
    border: none;
    border-top: solid 1px #d12222;
    border-right: solid 1px #d12222;
    border-bottom: none;
    border-left: none;
}

a.gallerylisttitle {
    display: block;
    font-size: 16px;
    width: 100%;
    overflow: hidden;
    line-height: 1.2em;
    margin-top: 5px;
    margin-bottom: 5px;
}

.gallerylistimage {
    text-align: center;
    overflow: hidden;
    position: relative;
    border: solid 1px #ccc;
    background: #f1f1f1;

}

.gallerylistdate {
    font-size: 16px;
    color: #999999;
    width: 100%;
    padding: 0px 0px 0px 0px;
    margin: 0px;
}

.listtitleimg {
    float: right;
    width: 86%;
    margin-right: 5px;
}

img.listheader {
    max-width: 66%;
    margin-bottom: 5px;
    padding-right: 15px;
    padding-left: 15px;
}

.list_city {
    display: inline-block;
    position: relative;
    float: right;
    margin-right: 4%;
}

/*---------- Manage Post List -------------*/
.listimage {
    width: 97px;
    height: 97px;
    text-align: center;
    border: solid 1px #666666;
    overflow: hidden;
    background-color: #999999;
    position: absolute;
    top: 2px;
    left: 9px;
    margin-top: 2px;
}
.listimage_saved .ribbon,
.listimage .ribbon,
.gallerylistimage .ribbon {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 70%;
    height: auto;
    opacity: .8;
}
.list_image_wrapper {
    width: 20%;
    min-width: 100px;
    display: inline-block;
}

.list_image_wrapper a img {
    width: 100px;
    height: 108px;
}
.listcontent_wrapp{
    width: calc(100% - 100px);
    padding: 0 10px;
    display: flex;
    flex-direction: column;
}

/* .manage_post__list_header{
    font-family: 'Neucha', cursive;
} */

#list .manage_post__list_header h2 {
    color: rgba(109, 32, 181, 1);
    font-weight: 700;
}

#list h2,
#list h4,
#list a {
  font-family: Arial;
}

.flexblock.listadd {
    background-color: transparent;

}
.list_post_info{
    font-size: 6pt;
    line-height: 1.3em;
    display: flex;
    overflow: hidden;
    word-wrap: break-word;
}
.list_post_location{
    display: block;
    font-size: 7pt;
    margin-bottom: 5px;
}

.list_post_info a.listtitle {
    position: relative;
    font-weight: 600;
    font-family: 'Neucha', cursive;
    font-size: 16px;
    letter-spacing: 1px;
}
.list_post_info a.listtitle .text-fader {
    position: absolute;
    height: 100%;
    width: 100%;
    min-height: 40px;
    background: linear-gradient(to top, rgb(255 255 255) 0%,rgba(255,255,255,0) 50%);
}
.list_post_info .titleAge{
    margin-left: auto;
}

.list_post_body{
    display: block;
    height: 52px;
    overflow: hidden;
    margin-top: 0px;
    line-height: 1.3em;
    flex-grow: 1;
    position: relative;
    font-size: 13px;
    white-space: pre-line;
}
.list_post_body::before {
    position: absolute;
    display: block;
    content: '';
    background: linear-gradient(to top, rgb(255,255,255) 0%,rgba(255,255,255,0) 50%);
    width: 100%;
    height: 100%;
}
.published_post_info{
    font-size: 9px;
    color: #777777;
    font-weight: 700;
    font-style: italic;
}
.view_buttons_container {
    display: inline-block;
    float: left;
    margin-top: 10px;
    margin-left: 38%;
}

.videoIcon {
    position: absolute;
    top: -5px;
    left: 0px;
    height: 15px;
    width: 42px;
    z-index: 1;
}

.videoIconManagePost {
    position: absolute;
    top: -9px;
    left: -4px;
    height: 15px;
    width: 42px;
    z-index: 10;
}

.videoIconManagePost img,
.videoIcon img {
    width: 100% !important;
    height: 100% !important;
    margin: 9px 0 0 4px;
}

.list-post-title-link {
    position: relative;
    display: block;
}

a:visited {
    color: #a20092;
}

a:link {
    color: #0000EE;
}

a.banLink {
    margin: 8px 0;
}

a {
    color: #337ab7;
    text-decoration: none;
    background-color: transparent;
}

a.listtitle {
    font-size: 9pt;
    line-height: 1.3em;
}

.font10 {
    font-size: 10px;
}

.font12 {
    font-size: 12px;
}

#emailForm .font12 {
    display: inline-block;
    white-space: nowrap;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 0;
}

@media screen and (max-width: 640px) {
    #emailForm .font12 {
        white-space: normal;
        width: 170px;
        left: 30%;
    }
}

.scammed-wrapper {
    max-width: 250px!important;
}

.gallerylistdate1 {
    position: absolute;
    top: 7px;
    left: 5px;
    font-size: 9px;
    color: #777777;
    width: 104px;
    padding: 0px 0px 0px 0px;
    margin: 96px 0px 0px 4px;
}

.listview {
    padding-right: 0;
    padding-left: 0;
}

.listview #list {
    margin: 26px 0px 0px 0px;
}

.listimage_saved img {
    width: 97px;
    height: 97px;
    object-fit: cover;
    object-position: center;
}

.listview #list:after {
    display: table;
    content: " ";
    clear: both;
}

.listcontent {
    font-size: 8pt;
    max-height: 118px;
    position: relative;
    float: none;
    width: 100%;
    display: block;
}

.fakeBlock {
    display: block;
    width: 99px;
    height: 98px;
    float: left;
    position: absolute;
    left: 0px;
}

.listinfo {
    font-size: 6pt;
    line-height: 1.3em;
    display: block;
    position: relative;
    left: 112px;
    overflow: hidden;
    margin-top: 0px;
    word-wrap: break-word;
    width: 70%;
}

.titleAge {
    width: 25px;
    display: inline-block;
    height: 13px;
    font-size: 12px;
    border: 1px solid #F5B700;
    border-radius: 0.25em;
    -o-border-radius: 0.25em;
    -ms-border-radius: 0.25em;
    -moz-border-radius: 0.25em;
    -webkit-border-radius: 0.25em;
    text-align: center;
    line-height: 13px;
    margin: 0 0 0 5px;
    padding: 0 4x;
    background-color: white;
}

.playIcon {
    border: medium none;
    display: inline-block;
    position: relative;
}

.listbody {
    display: block;
    height: 52px;
    overflow: hidden;
    margin-top: 0px;
    line-height: 1.3em;
    position: relative;
    left: 112px;
    width: 80%;
    white-space: pre-line;
}

.clearrHeight {
    clear: both;
}

.imageBehind {
    position: absolute;
    top: 105px;
    left: 0px;
    width: 98px;
    height: 10px;
}

.gallerylistdate1 {
    position: absolute;
    top: 7px;
    left: 5px;
    font-size: 9px;
    color: #777777;
    width: auto;
    padding: 0px 0px 0px 0px;
    margin: 96px 0px 0px 12px;
    /* z-index: 1; */
}

/* Banners */
.banner-wrapper {
    width: 100%;
    max-width: 600px;
    margin-top: 8px;
}
.item-banner {
    overflow: hidden;
    width: 100%;
    position: relative;
}
.item-banner:before {
    content: "sponsor";
    background: #c9c9c9;
    width: 100%;
    height: 18px;
    color: #fff;
    text-transform: uppercase;
    display: block;
    line-height: 9px;
    font-size: 13px;
    padding-bottom: 14px;
    padding-top: 5px;
    text-align: center;
    border-radius: 20px 20px 0 0;
    letter-spacing: 0px;
    font-family: Arial, sans-serif;
}
.page-banner {
    position: relative;
    cursor: pointer;
    display: block;
    max-width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0;
    background: #fff;
    margin-bottom: 10px;
    background-color: #3a3a3a;
}

#manage-post-banner ins a img {
    max-width: 100vw;
    height: auto;
}
#manage-post-banner img {
    max-width: 100%;
    height: auto;
}
/* Banners end */

.whiteGradientNew {
    background: -moz-linear-gradient(top, rgba(251, 254, 249, 0) 0%, rgba(251, 254, 249, 0) 30%, rgba(251, 254, 249, 1) 69%, rgba(251, 254, 249, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(251, 254, 249, 0)), color-stop(30%, rgba(251, 254, 249, 0)), color-stop(69%, rgba(251, 254, 249, 1)), color-stop(100%, rgba(251, 254, 249, 1)));
    background: -webkit-linear-gradient(top, rgba(251, 254, 249, 0) 0%, rgba(251, 254, 249, 0) 30%, rgba(251, 254, 249, 1) 69%, rgba(251, 254, 249, 1) 100%);
    background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 30%, rgba(251, 254, 249, 1) 69%, rgba(251, 254, 249, 1) 100%);
    background: -ms-linear-gradient(top, rgba(251, 254, 249, 0) 0%, rgba(251, 254, 249, 0) 30%, rgba(251, 254, 249, 1) 69%, rgba(251, 254, 249, 1) 100%);
    background: linear-gradient(to bottom, rgba(251, 254, 249, 0) 0%, rgba(251, 254, 249, 0) 30%, rgba(251, 254, 249, 1) 69%, rgba(251, 254, 249, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#fff', GradientType=0);
}

.highlifgtGradientNew {
    background: -moz-linear-gradient(top,  rgba(236,236,236,0) 0%, rgba(236,236,236,0) 30%, rgba(236,236,236,1) 69%, rgba(236,236,236,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(236,236,236,0)), color-stop(30%,rgba(236,236,236,0)), color-stop(69%,rgba(236,236,236,1)), color-stop(100%,rgba(236,236,236,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(236,236,236,0) 0%, rgba(236,236,236,0) 30%, rgba(236,236,236,1) 69%,rgba(236,236,236,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(236,236,236,0) 0%, rgba(236,236,236,0) 30%, rgba(236,236,236,1) 69%,rgba(236,236,236,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(236,236,236,0) 0%, rgba(236,236,236,0) 30%, rgba(236,236,236,1) 69%,rgba(236,236,236,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(236,236,236,0) 0%, rgba(236,236,236,0) 30%, rgba(236,236,236,1) 69%,rgba(236,236,236,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
}

.camouflage3 {
    position: absolute;
    width: 100%;
    height: 56px;
    left: 106px;
    bottom: 0px;
    z-index: 0;
}

img {
    border: 0;
}

img.devilgirl_hookups {
    position: absolute;
    top: 0;
    max-height: 220px;
    display: block;
    max-width: 33.333%;
}
/*----- Pending transaction page  -----*/

#transactionFailedContainer {
    display: none;
    position: absolute;
    top: calc(50% - 135px);
    left: calc(50% - 154px);
    background-color: #fcf99a;
    z-index: 12500;
    width: 310px;
    height: 274px;
    border-radius: 30px;
    border: 2px solid #741a16;
    filter: drop-shadow(0px 5px 5px black);
    text-align: center;
}

#transactionFailedContainer .caption {
    font-size: 26px;
    font-weight: bold;
    font-family: Arial;
    padding: 13px 0 0 0;
    color: #ac0303;
}

#transactionFailedContainer .text {
    font-size: 17px;
}

#transactionFailedContainer .box {
    width: 80%;
    height: 100px;
    background-color: white;
    margin: 6px 0 7px 10%;
    padding: 10px;
}

#transactionFailedContainer #buttonTransaction {
    bottom: 0;
    width: 100%;
    background-color: white;
    height: 37px;
    position: absolute;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    border: 1px solid gray;
    padding: 6px 0;
    font-size: 18px;
    color: #0245a1;
    font-weight: 700;
    cursor: pointer;
}

#transactionFailedContainer #buttonSupport {
    top: 300px;
    position: absolute;
    left: 10%;
    width: 80%;
    background-color: #741a16;
    height: 33px;
    border-radius: 20px;
    color: white;
    font-size: 19px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    cursor: pointer;
}

#transactionPendingContainer {
    position: relative;
    /* top: calc(50% - 135px); */
    left: calc(50% - 154px);
    background-color: white;
    z-index: 12500;
    width: 310px;
    height: 211px;
    border-radius: 30px;
    filter: drop-shadow(0px 5px 5px black);
    text-align: center;
}

#transactionPendingContainer .caption {
    font-size: 26px;
    font-weight: bold;
    padding: 12px;
}

/*----- Progress bar animation  -----*/
ul.animation {
    list-style-type: none;
    margin-bottom: 0;
}
li.animation {
    float: left;
    width: 16px;
    height: 64px;
    border: 1px solid #8490c6;
    box-sizing: border-box;
    margin-right: 5px;
    opacity: 0.2;
    border-radius: 10px;
}

li.animation:nth-child(1) {
    background-color: #3dcb9a;
    animation-name: anim;
    animation-duration: 1.2s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}
li.animation:nth-child(2) {
    background-color: #d653d6;
    animation-name: anim;
    animation-duration: 1.2s;
    animation-delay: .3s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

li.animation:nth-child(3) {
    background-color: #fd9332;
    animation-name: anim;
    animation-duration: 1.2s;
    animation-delay: .6s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

li.animation:nth-child(4) {
    background-color: #ce1222;
    animation-name: anim;
    animation-duration: 1.2s;
    animation-delay: .9s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@keyframes anim {
    from {
        opacity: 1;
        transform: scale(1.1);
    }
    50% {
        opacity: 0.2;
        transform: scale(.6);
    }
    to {
        opacity: 1;
        transform: scale(1.1);
    }
}


/*----- Pending transaction page END -----*/

/*----- Payment Product List  -----*/

.button-payment {
    display: block;
    width: 260px;
    padding: 12px 0;
    margin: 10px auto;
    text-align: center;
    font-family: Arial, sans-serif;
    font-weight: bold;
    font-size: 20px;
    color: #ffffff;
    border-radius: 30px;
    cursor: pointer;
    text-shadow: 0 1px 2px rgba(0,0,0,0.45);
    border: 1px solid rgba(0,0,0,0.35);
    box-shadow:
        inset 0 2px 3px rgba(255,255,255,0.4),
        0 3px 6px rgba(0,0,0,0.35);
    transition: transform 0.1s ease, box-shadow 0.1s ease;
}

.button-payment:hover {
    transform: scale(1.03);
    box-shadow:
        inset 0 2px 3px rgba(255,255,255,0.55),
        0 4px 8px rgba(0,0,0,0.4);
}

.button-payment:active {
    transform: scale(0.97);
    box-shadow:
        inset 0 2px 3px rgba(255,255,255,0.25),
        0 2px 4px rgba(0,0,0,0.25);
}


.button-payment.pink {
    background: linear-gradient(to bottom, #ffaadf 0%, #ff72c9 50%, #d347a2 100%);
}


.button-payment.green {
    background: linear-gradient(to bottom, #7eff7e 0%, #1cd91c 50%, #0c980c 100%);
}

.payment-item-wrapper {
    width: 117%;
    display: block;
    cursor: pointer;
    margin: -7px 0 6px -9%;
}
.payment-item-wrapper img{
    width: 100%;
}

.payment-form_header-banner{
    background-color: #4b0113;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px;
}
.payment-form_header-banner img,
.flex-btn img {
    width: 100%;
}
.payment-form_header-banner .left_title{
    width: 42%;
}
.payment-form_header-banner .header_middle_lock{
    width: 9%;
}
.payment-form_header-banner .right_title{
    width: 35%;
}
.footer-back-btn,
.footer-next-btn{
    width: 114px;
    margin-bottom: -3px;
}
.footer-middle-lock{
    width: 30px;
}
#payment-method-popup img.payment-methods-popup {
    filter: drop-shadow(0 1px 5px black);
}
.payment_wrapper {
    font-family: 'ITC American Typewriter', serif;
    margin: -10px auto;
    background: linear-gradient(to bottom, rgba(136,215,254,1) 0%,rgba(255,255,255,0) 100%);
}
.payment-group-inline-block-start>div {
    display: inline-flex;
    align-items: flex-end;
}
.payment-group-inline-block-start>div>div:nth-child(1) {
    padding-right: inherit;
}
.payment-group-inline-block-start>div>div:nth-child(2) {
    padding-left: inherit;
}
.prodectList_heaser_info{
    text-align: center;
    margin-top: 135px;
    padding: 0;
    font-size: 23px;
}
.prodectList_heaser_subtitle{
    font-weight: 900;
}
.exchange_rates_title{
    font-weight: 600;
}
.exchange_rates{
    font-size: 15px;
    font-weight: 400;
}

.prodectList_heaser > .prodectList_heaser_info > img {
    transform: scale(1.2);
    padding: 20px 23px 0 3px;
}

/* .container.payment_wrapper > .container.zeroSidePadding {
    top: 13px;
    margin-bottom: 10px;
} */

.exchange_rates_title, .exchange_rates{
 color: #ae7600;
}

.payment-group-inline-block {
    display: flex;
    align-items: flex-end;
}
.payment-group-inline-block>div:nth-child(1) {
    padding-right: 0;
}
.payment-group-inline-block>div:nth-child(2) {
    padding-left: 0;
}

.payment-group-inline-block #state,
.payment-group-inline-block-start #state {
    height:34px;
    width: 100%;
}

/*------------ Payment popup -------------- */
.popup_wrapper img {
    width: 100%;
}

#payment-method-popup {
    position: fixed;
    height: 100vh;
    width: 100vw;
    z-index: 2010;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.5);
}

.popup_wrapper {
    padding: 0 0 30px 0;
    position: relative;
    max-width: 500px;
    height: auto;
    margin: 50px auto;
    width: 90%;
}
.popupHeader{
    position: absolute;
    z-index: 1;
    width: 70%;
    margin: 0 15%;
}
.popupHeader img{
    transform: translateY(-40%);
    position: absolute;
    width: 100%;
}
.payment-methods-popup {
    display: block;
    height: 100%;
    width: 100%;
    position: absolute;
}
.method-popup__close_Btn{
    display: block;
    width: 15%;
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    transform: translate(25%, -24%);
}
.method-popup__close_Btn img{
    width: 100%
}
.You_are_buying{
    font-size: 3vmin;
    margin: 10% 8% 0;
    position: relative;
}
.You_are_buying .you_are_buying_container {
    width: 100%;

}

.You_are_buying div {
    display: block;
    width: 50%;
    position: absolute;
    height: 3em;
    bottom: 0;
    margin: 0 25%;
}

.payment_info_popup-wrapper {
    display: flex;
    justify-content: space-between;
    position: relative;
    padding: 0 2% 0 32%;
}

.select_method {
    color: #ae7600;
    font-family: 'ITC American Typewriter', serif;
    font-weight: bold;
    font-size: 13pt;
    position: relative;
    margin-top: 32px;
    margin-bottom: 16px;
    text-align: center;
}

.PaymentBtns {
    width: 80%;
    margin: 2% auto;
    position: relative;
    overflow-y: scroll;
    outline: none;
    overflow-x: hidden;
}
.PaymentBtns::-webkit-scrollbar,
#payment-method-popup .zeroSidePadding::-webkit-scrollbar{
    width: 5px;
    border-radius: 20px;
    position: absolute;
}
.PaymentBtns::-webkit-scrollbar-thumb,
#payment-method-popup .zeroSidePadding::-webkit-scrollbar-thumb{
    width: 10px;
    background: #fd9eded9;
    display: block;
    border-radius: 15%;
    position: absolute;
    right: -10px;
}
.payment_method_name {
    color: white;
    font-weight: bold;
    background: no-repeat center;
    width: 100%;
    background-size: 85% 100%;
    padding: 0 10%;
    margin: 5px auto;
    font-size: 26px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    /* filter: drop-shadow(1px 1px 3px black); */
}

.close-btn {
    color: gray;
    font-size: x-large;
    font-weight: bolder;
    cursor: pointer;
}

@media screen and (max-width: 400px) {
    .payment_method_name {
        font-size: 19px;
    }
}

@media screen and (max-width: 300px) {
    .payment_method_name {
        font-size: 13px;
    }
}

.payment_method_name_0,
.payment_method_name_3 {
    background-image: url(/resources/img/payment_button_0.png)
}
.payment_method_name_1,
.payment_method_name_4 {
    background-image: url(/resources/img/payment_button_1.png)
}
.payment_method_name_2,
.payment_method_name_5 {
    background-image: url(/resources/img/payment_button_2.png)
}

#payment-method-popup .zeroSidePadding{
    height: 100vh;
    overflow-y: scroll;
}
@media all and (orientation: landscape){
    .popup_wrapper{
        max-width: 450px;
        margin: 10px auto;
    }
    #payment-method-popup .zeroSidePadding{
        overflow-y: scroll;
        height: 600px;
        padding: 50px 0 200px;
    }
}

@media all and (orientation:landscape), 
    all and (max-width: 768px),  
    all and (max-height: 414px) {
    #confirmModal_verification > .modal-dialog {
        transform: scale(.7);
    }
    #termsandconditions {
        border-radius: 20px;
    }
    #close-popup-up {
        width: 7%;
    }
}

/* ----- Method payment list ----- */

.usingMethod[type=radio] {
    -webkit-appearance:button;
    -moz-appearance:button;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 20px;
    width: 20px;
    border: 1px solid #3F51B5;
    border-radius: 4px;
    margin: 11px auto;
}

.usingMethod[type=radio]:checked::before {
    display: block;
    content: '\2714';
    position: absolute;
}

.method_list_name {
    border: 2px solid #3F51B5;
    border-radius: 4px;
    color: black;
    flex-grow: 1;
    line-height: 40px;
}

.method_payment_btn {
    background-image: repeating-linear-gradient(-45deg, #f086d0, #f086d0 15px, #f171c4 25px, #f171c4 35px, #f086d0 45px );
    padding: 10px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 21px;
    border: 8px solid #fceabb;
}

.method_btn_background{
    background-color: #f0f0f0;
    border-radius: 10px;
    min-height: 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* ----   Cards info styling --- */
.copyright_footer{
    text-align: center;
    margin: 20px auto 0;
    color: #00000080;
    padding: 20px 6px;
}
.copyright_footer_additional{
    position: absolute;
    bottom: 0;
    width: 100%;
}
.card_info_wrapper {
    width: 80%;
    margin: 15px auto;
}
.card-form.payment_wrapper{
    background: #fcfadc;
    border: 10px solid #4b0113;
    font-family: Arial;
    overflow: hidden;
}
.card-form-title{
    font-weight: 700;
    color: #114b01;
    margin-top: 7px;
}
.card-form .img-responsive {
    transform: scale(1.5);
    margin-top: 27px;
    margin-bottom: 20px;
}
@media (min-width: 500px) and (max-width: 768px) {
    .card-form .img-responsive {
        transform: scale(1.2);
    }
}
@media (min-width: 320px) and (max-width: 350px) {
    .postadforfree_words_inner {
        top: 107px !important;
        width: 94px !important;
        left: 7% !important;
    }
}
@media (min-width: 350px) and (max-width: 430px) {
    .postadforfree_words_inner {
        top: 134px !important;
        width: 94px !important;
        left: 7% !important;
    }
}
@media (min-width: 430px) and (max-width: 480px) {
    .postadforfree_words_inner {
        top: 148px !important;
        width: 107px !important;
        left: 7% !important;
    }
}
.payment-amount{
    font-size: 1.5em;
    font-weight: 600;
    color: #fbb203;
}
.credit-debit_item{
    width: 30%;
    min-width: 200px;
}
.card_info_wrapper label{
    display: inline-block;
    max-width: 100%;
    font-weight: 400;
    margin: 0 5px 0 0;
    overflow-wrap: anywhere;
}
@media (max-width: 350px) {
    .card_info input,
    .card_info select,
    .card_info_wrapper label {
        font-size: 17px;
    }
}

.card_info {
    display: flex;
    flex-direction: column;
    padding-bottom: 5px;
    font-size: 20px;
}
.card_info_date .echeck_info {
    width: 40%;
}

.card_info_date .echeck_info input,
.echeck_info_wrapp input {
    width: 100%;
}
.flex-betwen{
    display: flex;
    justify-content: space-between;
}
.flex-col input {
    flex-grow: 1;
}
.payment_amount_wrapp{
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: medium;
    margin-top: -14px;
}
label[for="submit-credentials-stage"] {
    height: 45px;
}
.payment_amount_wrapp div{
    margin: 5px;
}
.expiry-date{
    margin-right: 5px;
}
.flex-col.expiry-date>.flex-row>#expiry-month {
    flex: 1;
}
.flex-col.expiry-date>.flex-row>#expiry-year {
    flex: 2;
}
.echeck_info_wrapp {
    width: calc(80% + 20%/3);
}
.inline-flex input,
.inline-flex select{
    flex-grow: 1;
}
.inline-flex{
    display: flex;
}
.card_info input,
.card_info select {
    border: 2px solid #b7b6b6;
    margin-bottom: 15px;
    border-radius: 5px;
    outline: none;
    /*background: transparent;*/
    /*border: none;*/
    /*border-bottom: 1px solid;*/
    /*margin-bottom: 15px;*/
    /*outline: none;*/
}
.flex-col{
    display: flex;
    flex-direction: column;
}
.flex-row{
    display: flex;
    flex-direction: row;
}
.align-end{
    align-items: flex-end;
}
.card_info_date {
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: flex-end;
}
/*label[for=payment-info-submit]{*/
    /*width: max-content;*/
/*}*/
input:not(:placeholder-shown):invalid{
/*     border-bottom-color: red;
    background-color: rgba(255, 0, 0, 0.2); */
}
.error-message {
    font-size: 12px;
    color: #ff0000;
    overflow-wrap: break-word;
}

.t1Button {
    display: flex;
    justify-content: center;
    margin: 15px 0;
}

.t1Button input {
    border: none;
}

.t1Button .t1Submit {
    border: outset;
}

.t1Button .t1Submit:active {
    border: ridge;
}

input.t1PaymentSubmit {
    width: 115px;
    border: none;
}

/*--------------------  payment success -----------------*/
.success_payment_image {
    width: 60%;
}
.success_payment_image  img{
    width: 100%;
}

.success_payment_title {
    font-size: 2.5rem;
}

.success_payment_title span{
    font-weight: bold;
    color: rgba(228, 120, 190, 1);
    font-size: 4.5rem;

}
/*--------------to keep one row images centered----------*/
@media (max-width: 600px) {
    .viewpostgallery {
        -moz-column-count: 1;
        -webkit-column-count: 1;
        margin: 0px auto 0px auto;
    }




}

@CHARSET "ISO-8859-1";
body {
    background-color: #fbfef9;
    font-family: Arial, sans serif;
    background-image: none;
}

.titleAge {
    width: 25px;
}

.listadd,
.listad {
    min-height: 116px;
    max-height: 116px;
    height: 116px;
    overflow: hidden;
    padding: 4px 3px 4px 3px;
    margin: 4px 5px 0px 0px;
    position: relative;
    background: #ececec;
}
.flexblock{
    display: flex;
}
.container {
    width: 100%;
    max-width: 600px;
    /* margin-bottom: 50px; */
    position: relative;
}

.singlepost .container {
    padding-right: 0;
    padding-left: 0;
}

.flowers {
    padding: 0px 0px 0px 0px;
    margin-left: -20px;
}

/*------------------paddings--------------------------*/
.zeroSidePadding,
.padd-0 {
    padding-left: 0px;
    padding-right: 0px;
}

.padd-top-25 {
    padding-top: 25px;
}

.padd-top-10 {
    padding-top: 10px;
}

.padd-top-15 {
    padding-top: 15px;
}

.padd-top-45 {
    padding-top: 45px;
}

.padd-top-4 {
    padding-top: 4px;
}

.padd-left-25 {
    padding-left: 25px;
}

.padd-left-10 {
    padding-left: 10px;
}

.padd-left-15 {
    padding-left: 15px;
}
/*------------------width--------------------------*/
.img-width-85, .width-85 {
    width: 85%;
}

.width-230 {
    width: 230px;
}

.width-280 {
    width: 280px;
}

.max-width-250 {
    max-width: 250px;
    margin: 0px auto 0px auto;
}

.width-130 {
    width: 130px;
}

.width-74 {
    width: 74px;
}

.width-205 {
    width: 205px;
}

.width-325 {
    width: 325px;
}

.width-280 {
    width: 280px;
}

.width-315 {
    width: 315px;
}

.width-195 {
    width: 195px;
}

img.img-width-72 {
    width: 72%;
}

.width-180 {
    width: 180px;
}

.width-265 {
    width: 265px;
}

.width-60-perc {
    width: 60%;
}

.img-width-100 {
    width: 100%;
}

.width-62 {
    width: 62px;
}

/*------------------color--------------------------*/

.gray {
    color: #6a6969;
}

.yellow {
    color: #fcbe01;
}

.red {
    color: red;
}

/*------------------margin--------------------------*/
.marg-top-m8 {
    margin-top: -8px;
}

.marg-top-8 {
    margin-top: 8px;
}

.marg-top-45 {
    margin-top: 45px;
}

.marg-top-20 {
    margin-top: 20px;
}

.marg-bott-4 {
    margin-bottom: 4px;
}
.marg-bott-10 {
    margin-bottom: 10px;
}

.marg-top-0 {
    margin-top: 0px;
}

.marg-top-10 {
    margin-top: 10px;
}

.marg-top-14 {
    margin-top: 14px;
}

.marg-top-15 {
    margin-top: 15px;
}

.marg-top-25 {
    margin-top: 25px;
}

.marg-left-30 {
    margin-left: 30px;
}

.automargin {
    margin: 10px auto -25px auto;
}

/*------------------padding--------------------------*/

.bold {
    font-weight: bold;
}

.bordered {
    border: 2px solid #888888;
}

.centered {
    text-align: center;
}

.centered-flex {
    width: 100%;
    display: flex;
    justify-content: center;
}

.underlined {
    text-decoration: underline;
}

.zero-radius {
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}

.three-radius {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.five-radius {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

textarea.height-200 {
    height: 200px !important;
}

#create_edit_post_body_field {

    height: 300px;
}

.candy input[type="text"], .candy input[type="tel"], #create_edit_post_body_field, .candy select {
    -webkit-box-shadow: inset 0px 3px 12px 0px rgba(0, 0, 0, 0.22);
    -moz-box-shadow: inset 0px 3px 12px 0px rgba(0, 0, 0, 0.22);
    box-shadow: inset 0px 3px 12px 0px rgba(0, 0, 0, 0.22);
}

.myButton {
    margin-top: 25px;
    width: 170px;
    height: 30px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 3px;
    background-color: #0492ff;
    color: white;
    border: 0px solid #fff;
    font-size: 18px
}

.successbutton {
    margin: 1em 0.3em;
    width: 140px;
}

#next_button_from_first_form_page {
    background: url('../img/button_next.png') no-repeat;
    background-color: transparent;
    background-size: 100% 100%;
    width: 130px;
    height: 60px;
    margin: 30px auto auto auto;
}

#back_button_from_second_form_page {
    background: url('../img/button_back.png') no-repeat;
    background-color: transparent;
    background-size: 100% 100%;
    width: 90px;
    height: 45px;
    position: absolute;
    left: 0px;
    bottom: 43px;
}

.previewbutton {
    background: transparent url('../img/button_publish.png') no-repeat;
    background-size: 100% 100%;
    width: 150px;
    height: 60px;
    display: block;
    clear: both;
    margin: auto auto 40px auto;
    position: relative;
    top: 0px;
}

.narrowButton {
    width: 100px;
}

.top-margin-55 {
    margin-top: 55px;
}

.top-margin-35 {
    margin-top: 35px;
}

.top-margin-25 {
    margin-top: 25px;
}

.height-34 {
    height: 34px;
}

.relative-position {
    position: relative;
}

.right-4 {
    right: -4px;
}

#myInputTypeFileButton {
    position: relative;
    right: -4px;
}

.myAnchor {
    color: b8b8b8;
    font-weight: bold;
    font-size: 14px;
}

.foundad_header {
    position: absolute;
    width: 55%;
    right: 39px;
    z-index: 2000;
    top: 17px;
}

.foundad_devilgirl {
    position: relative;
    top: 3px;
    width: 97%;
    margin: 0;
}

.foundad_devilgirl_returning {
    position: relative;
    top: 3px;
    width: 97%;
    margin: 0;
}

#megap4choiceTopText {
    position: absolute;
    top: 32%;
    left: 29%;
    color: black;
    font-weight: bold;
    font-size: 17px;
    line-height: 1.2;
    width: 60%;
    text-align: right;
    font-style: italic;
}

#megap4choiceTopText .found_mostrecent {
    font-size: 17px;
}

@media screen and (max-width: 600px) {
    #megap4choiceTopText {
        width: 70%;
        left: 26%;
        font-size: 12px;
    }
}

#megap4choiceTopText span {
    color: #f96111;
}

#megap4choiceTopText span.whatwould {
    color: #3d3c3c;
}

#megap4choice {
    position: relative;
    margin-top: 6px;
    width: 100%;
    padding: 0 3px 20px;
    margin: 5px auto -17px auto;
}

#megap4choiceDarkBlueButton {
    background: url('../img/3button_top.png') no-repeat;
    background-size: 100% 100%;
    top: 44%;
}

#megap4choiceDarkBlueButton2 {
    background: url('../img/3button_top2.png') no-repeat;
    background-size: 100% 100%;
    top: 40%;
}

#megap4choiceBlueButton {
    background: url('../img/3button_mid.png') no-repeat;
    background-size: 100% 100%;
    top: 52%;
}

#megap4choiceBlueButton2 {
    background: url('../img/3button_mid2.png') no-repeat;
    background-size: 100% 100%;
    top: 56.5%;
}

#megap4choiceLightBlueButton {
    background: url('../img/3button_bottom.png') no-repeat;
    background-size: 100% 100%;
    top: 72%;
}

#megap4choiceLightBlueButton2 {
    background: url('../img/3button_bottom2.png') no-repeat;
    background-size: 100% 100%;
    top: 74.2%;
}

#megap4choiceDarkBlueButton, #megap4choiceBlueButton, #megap4choiceLightBlueButton {
    border-radius: 0px;
}

#megap4AdSampleShadowEmulator {

    width: 100%;
    background: url('../img/newshadow.png') no-repeat;
    height: 17px;
    margin-bottom: -17px;
    background-position: center -8px;

}

.fromRight {
    float: right;
}

#submit-pre-search-btn {
    margin-top: -40px;
}

#search-report-form .form-group textarea {
    resize: none;
}

#search-report-form .checkbox-group label {
    text-transform: capitalize;
}

.fromLeft {
    float: left;
}

.width-25proc, .width-24proc {
    width: 25%;
    padding: 4px;
    position: relative;
}

.text-left {
    text-align: left;
}

p.success {
    font-size: 16px;
}

#confirmModal_notPublished p.success,
#verificationModal_notPublished p.success {
    font-family: Arial;
    font-weight: 600;
    font-size: 1.2em;
    color: #464545;
}

#megap4AdSampleHeader {
    color: black;
    font-weight: bold;
    font-size: 21px;
    line-height: 1.2;
    width: 94%;
    /* height: 96px; */
    margin: 10px auto 10px auto;
    padding: 0.5em;
    /* background-color: #e4e6e6; */
}

@import url(https://fonts.googleapis.com/css?family=Oswald:700);
.megap4choiceButtons {
    padding-top: 1%;
    position: absolute;
    width: 72%;
    left: 9%;
    height: 21%;
    color: white;
    text-align: center;
    font-size: 36px;
    font-weight: bold;
    font-family: 'Oswald', sans-serif;
}

.postCreatedOn {
    color: #666666;
    line-height: 1.8;
    font-size: 8pt;
    margin: -2px 7px 9px -2px;
    padding-bottom: 4px;
    font-weight: normal;
}

#megap4AdSampleContent {
    margin: 10px auto;
    color: black;
    font-size: 13px;
    width: 100%;
}

span.postersAge {
    font-size: 15px;
}

.viewpostlocation {
    margin: 0px 0px 0px -13px;
    font-size: 10pt;
    font-weight: bold;
    word-wrap: break-word;
    position: relative;
    left: -10px;
}

span.postersPhone {
    font-size: 18px;
    color: #0000ef;
    text-decoration: underline;
    display: block;
    margin: 10px 0;
}

#megap4AdSample {
    width: 100%;
    background: white;
}

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

.circle {
    height: 26px;
    width: 26px;
    line-height: 26px;
    border-radius: 26px;
    color: #fff;
    background-color: #0084ff;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    margin: 2px 0 0 5px;
}

.writePostContainer {
    margin-left: 15px;
    margin-right: 15px;
}

.photosRow {
    width: 100%;

}

.photosRow img {
    height: auto;
    width: 100%;
    border-radius: 10px;
}

.videosRow img {
    height: auto;
    width: 100%;
}

.zero_height {
    height: 0px;
}

#addPhotoBorderedBlock {
    width: 98%;
    padding: 1px 10px 5px 10px;
    margin: -7px auto 5px auto;
    border: 1px solid #818181;
    background: #fff;
    overflow: hidden;
    -webkit-box-shadow: inset 0px 7px 22px 2px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: inset 0px 7px 22px 2px rgba(0, 0, 0, 0.20);
    box-shadow: inset 0px 7px 22px 2px rgba(0, 0, 0, 0.20);
}
#addVideoBorderedBlock {
    width: 98%;
    padding: 1px 10px 5px 10px;
    margin: -3px auto 5px 6px;
    border: 1px solid #818181;
    background: #fff;
    display: inline-block;
    -webkit-box-shadow: inset 0px 7px 22px 2px rgba(0, 0, 0, 0.20);
    -moz-box-shadow: inset 0px 7px 22px 2px rgba(0, 0, 0, 0.20);
    box-shadow: inset 0px 7px 22px 2px rgba(0, 0, 0, 0.20);
    position: relative;
    top: -10px;
}
@media screen and (min-width: 340px) and (max-width: 460px) {
    #addPhotoBorderedBlock span,
    #addVideoBorderedBlock span {
        font-size: 3.5vw;
    }
}
@media screen and (max-width: 339px) {
    #addPhotoBorderedBlock span,
    #addVideoBorderedBlock span {
        font-size: 3.2vw;
    }
}

.photo-item {
    position: relative;
}

.photo-item.selectable {
    cursor: pointer;
}

.photo-item.selected {
    /* width: calc(25% - 3px); */
    border-radius: 12px;
    border: 3px dashed #fe5dbc;
    box-shadow: inset 0 0 3px 1px #fe5dbc;
    transform: translateY(2px);
    display: inline-block;
}

.photo-item .imagedelete {
    clear: both;
    background-image: url("/resources/img/trash-icon.png");
    max-width: 70px;
    margin: auto;
    width: 32px;
    height: 32px;
    position: absolute;
    top: 4px;
    right: 4px;
    background-size: 32px;
    cursor: pointer;
    filter: drop-shadow(0px 0px 3px white) drop-shadow(0px 0px 3px white);
}

@media screen and (max-width: 600px) {
    .photo-item .imagedelete {
        width: 5vw;
        height: 5vw;
        background-size: 5vw;
    }
}

.photo-item.selected .imagedelete {
    top: -1px;
    right: 1px;
}

#yesNoButtonsContainer {
    width: 222px;
    margin: 0px auto 10px auto;
    padding: 0px 10px 10px 10px;
}

#upload_image_progress_id {
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 5px;
}

.what_are_invisible {
    color: #fea700;
    font-size: 17px;
    text-decoration: underline;
    width: 270px;
    margin: 28px auto 10px auto;
    padding: 0px 10px 10px 10px;
    font-style: italic;
    text-align: center;
}

.bottomDisclaimer {
    bottom: 10px;
    left: 0px;
    color: #e6c568;
    font-size: 14px;
    width: 100%;
    text-align: left;
    font-style: italic;
    margin-top: 2em;
}

.front_testimonial {
    color: #edddc0;
    font-size: 16px;
    font-style: italic;
    text-align: center;
}

.disclaimer {
    left: 0px;
    color: #e6c568;
    font-size: 16px;
    width: 100%;
    text-align: left;
    padding-right: 16px;
    font-style: italic;

}

.invisible_tags_are {
    color: #787777;
    line-height: 1.2;
    font-size: 17px;
    width: 85%;
    margin: 12px auto 0px auto;
    padding: 0px 10px 10px 10px;
    font-style: italic;
}

.invisibleTagsField {
    width: 88%;
    margin: -7px auto 0px auto;
}

.videosRow video {
    height: 9em;
    width: 100%;
    float: left;
    margin: 0;
    border-radius: 10px;

}

.videosRow video::-webkit-media-controls {
    display: none !important;
}

.videosRow .vidthumboverlay {
    display: block;
    background: url('../img/videoplaybutton.png') no-repeat;
    background-size: 100% 100%;
    width: 100%;
    position: absolute;
    height: calc(100% - 24px);
    pointer-events: none;
}

.picLabel {
    position: absolute;
    font-weight: bold;
    font-size: 5em;
    color: #E6E6E6;
    top: 42%;
    left: 50%;
    width: 100%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: (-50%, -50%);
}

/*----------------------post_preview_styles_starts-----------------------*/
.post_preview {
    display: flex;
    min-height: 160px;
    padding: 16px 0;
    background-image: url('../img/megapersonalsPostTitleBackground.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
@media screen and (max-width: 600px) {
    .post_preview {
        padding-top: 2vw;
    }
}
.post_preview_title {
    word-wrap: break-word;
    font-size: 13pt;
    font-weight: bold;
    margin: 10px;
    min-height: 47px;
    text-align: left;
    background: #d7fdf8;
    padding: 5px;
}

.post_preview_caption {
    width: 100%;
    max-width: 96%;
    border: 1px solid #d3c2a1;
    margin: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: inset 0 0 4px 2px #00000038;
    border-radius: 18px;
    margin-top: 36px;
}
@media screen and (max-width: 600px) {
    .post_preview_caption {
        margin-top: 6vw;
    }
}
.post_preview_caption > div {
    border: 4px solid #ff73b4;
    width: 96%;
    margin: 10px 0;
    padding: 8px 4px;
    text-align: center;
    border-radius: 9px;
    font-size: 16px;
    font-weight: 900;
    color: #c71356;
}

.post_preview_date_time {
    color: #666666;
    font-size: 8pt;
    text-align: left;
    font-weight: normal;
    text-transform: none;
}

.post_header {
    text-align: center;
    font-size: 38px;
    color: black;
    font-weight: 900;
    text-transform: uppercase;
    padding: 0 0 8px 0;
}

@media screen and (max-width: 600px) {
    .post_header {
        font-size: 6vw;
    }
}

.post_title {
    padding: 4px;
    border: 3px solid #d2c4bd;
    margin: auto;
    width: 95%;
    max-width: 500px;
    border-radius: 18px;
    background-color: #faf4d8;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
}
.post_title_caption {
    border: 3px solid #ff86c7;
    color: black;
    background-color: white;
    margin: 0;
    padding: 12px 0;
    border-radius: 14px;
    font-size: 14px;
}

.post_preview_info {
    display: flex;
    margin: 14px 8px 0 16px;
}

.post_preview_info .col:nth-child(1) {
    min-width: 60%;
}
.post_preview_info .col:nth-child(2) {
    min-width: 40%;
}
.post_preview_info .col div {
    font-weight: bold;
}
.post_preview_info .col span {
    font-size: 16px;
}
.post_preview_info .col span:nth-child(1) {
    color: #aa1f54;
}
.post_preview_info .col span:nth-child(2) {
    color: black;
}

.post_preview_content {
    margin: 8px;
    padding: 8px 16px;
    color: #4a1607;
    font-size: 14px;
    line-height: 24px;
    white-space: pre-wrap;
    border: 4px solid #e3bbc4;
    border-radius: 16px;
}

.post_preview_body {
    margin: 0px 0px 12px 0px;
    font-size: 11pt;
    padding: 0px 10px 0px 10px;
    clear: both;
}

.post_preview_media .media-wrapper {
    width: 100%;
    position: relative;
    display: inline-block;
    padding: 0 20px;
    background-color: #e6e6e6;
}

.post_preview_media .media-wrapper video {
    width: 100%;
    border: 4px solid #e0c1e3;
}
  
.post_preview_media .media-wrapper::before,
.post_preview_media .media-wrapper::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='100'%3E%3Crect fill='%23fff' width='10' height='10' /%3E%3Crect fill='%23fff' y='20' width='10' height='10' /%3E%3Crect fill='%23fff' y='40' width='10' height='10' /%3E%3Crect fill='%23fff' y='60' width='10' height='10' /%3E%3Crect fill='%23fff' y='80' width='10' height='10' /%3E%3C/svg%3E");
    background-repeat: repeat-y;
    background-position: left center;
    background-size: contain;
}
  
.post_preview_media .media-wrapper::before {
    left: 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='100'%3E%3Crect fill='%23fff' width='10' height='10' /%3E%3Crect fill='%23fff' y='20' width='10' height='10' /%3E%3Crect fill='%23fff' y='40' width='10' height='10' /%3E%3Crect fill='%23fff' y='60' width='10' height='10' /%3E%3Crect fill='%23fff' y='80' width='10' height='10' /%3E%3C/svg%3E");
    border-left: 10px solid #e6e6e6;
}
  
.post_preview_media .media-wrapper::after {
    right: 0;
    transform: scaleX(-1);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='100'%3E%3Crect fill='%23fff' width='10' height='10' /%3E%3Crect fill='%23fff' y='20' width='10' height='10' /%3E%3Crect fill='%23fff' y='40' width='10' height='10' /%3E%3Crect fill='%23fff' y='60' width='10' height='10' /%3E%3Crect fill='%23fff' y='80' width='10' height='10' /%3E%3C/svg%3E");
    border-left: 10px solid #e6e6e6;
}
  
.post_preview_media .media-wrapper img {
    display: block;
    width: 100%;
    height: auto;
    z-index: 1;
    border: 4px solid #f9c2e7;
}

.post_preview_media hr {
    border-top: 2px solid #d3c2a1;
    visibility: hidden;
}

.all-other-posts {
    text-align: center;
    color: #523e3e;
    font-size: 42px;
    font-weight: 900;
}

.notices-and-messages {
    display: flex;
    gap: 12px;
    justify-content: center;
    align-items: center;
    background-color: #b8dcea;
    color: #061a40;
    text-decoration: none;
    font-size: 32px;
    font-weight: 900;
    width: fit-content;
    margin: 24px auto;
    padding: 20px 32px;
    border-radius: 22px;
    box-shadow: 11px 11px 14px gray;
    transition-duration: .2s;
}
.notices-and-messages:hover {
    text-decoration: none;
}
@media screen and (max-width: 600px) {
    .notices-and-messages {
        font-size: 5vw;
    }
}
.notices-and-messages:active {
    transform: translate(6px, 6px);
    box-shadow: none;
    transition-duration: .2s;
}
.notices-and-messages img {
    width: 32px;
}

@media screen and (max-width: 600px) {
    .all-other-posts {
        font-size: 7vw;
    }
}

.postbody {
    white-space: pre-line;
    display: block;
    margin: -1em 0;
    padding: 0 10px;
}

.i-see {
    margin: 10px;
    padding: 5px;
    color: #ffc643;
    font-weight: bold;
    font-size: 11px;
}
.isee-age {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    margin: 2px;
    gap: 2px;
}
.isee-age > div {
    text-align: left;
    min-width: 0;
    word-wrap: break-word;
}
.singlepost .viewpostgallery img {
    margin-bottom: 6px;
}
.border-red {
    border: 2px solid red;
}
.container-post-details .post_preview_title {
    margin: 6px 0px;
}
.isee-age__label {
    font-weight: bold;
    margin-right: 4px;
    font-size: 18px;
}
.isee-age__value {
    text-transform: lowercase;
}
@media screen and (max-width: 460px) {
    .isee-age__label {
        font-size: 4vw;
    }
    .isee-age__value {
        font-size: 3.8vw;
    }
}
#iseeCategories_itemList {
    min-width: 90px;
}
#iseeCategories_itemList span label {
    display: none;
}
.singlepost .postbody {
    margin: 1em 0;
}

.post_preview_age {
    margin: 5px 20px 5px 0;
    font-size: 9pt;
    display: inline-block;
    float: right;
    background: #818181;
    border-radius: 2px;
    color: #fff;
    padding: 1px 5px;
    min-width: max-content;
}

.post_preview_phone {
    font-size: 11pt;
    font-weight: normal;
    text-decoration: underline;
    padding: 0;
    color: #0000EE;
    margin-left: 10px;
}

.post_preview_location {
    margin: 18px 0px 12px -14px;
    font-size: 9pt;
    font-weight: bold;
    word-wrap: break-word;
}

.post_preview_image {
    width: 90%;
    height: auto;
    float: left;
    margin: 2px 3px 4px 1px;
}

.preview_pinkhead {
    background: #fd34ab;
    padding: 1.5em 15px;
    position: relative;
    box-shadow: 0 6px 13px -5px #5D5D5D;
}

.previewborder {
    height: calc(100% - 10px) !important;
}

.preview_byline {
    width: 100%;
    position: absolute;
    right: 36px;
    bottom: 32px;
    font-size: 30px;
    line-height: 35px;
    font-weight: bold;
    color: #fff;
    font-style: italic;
    text-align: right;
    letter-spacing: 1px;
}

.preview_category {
    text-align: right;
    padding: 0 5px;
    font-style: italic;
    color: #757573;
    font-weight: bold;
    font-size: 12px;
}

.prev_bg {
    background: #fbfef9;
}

.prev_bg::after {
    content: '';
    display: block;
    clear: both;
}

body.candyprev {
    background: #aaa;
}

.prev_email a {
    text-decoration: underline;
}

p.prev_city {
    margin: 15px 0 0 0;
}

ul.prev_location {
    padding: 0;
    list-style-position: inside;
    font-style: italic;
}

.prev_bottom {
    background: #fcdeed;
    padding-top: 2em;
    position: relative;
}

.postnow_cake {
    background: url('../img/postnow_cake.png') no-repeat;
    width: 120px;
    height: 85px;
    background-size: 100% 100%;
    border: 0;
    margin-bottom: 3em;
}

.brown_editpost {
    background: url('../img/brown_editpost.png') no-repeat;
    background-color: transparent;
    background-size: 100% 100%;
    width: 110px;
    height: 52px;
    position: absolute;
    left: 0px;
    border: 0;
    top: 51px;
}

@media (min-width: 601px) {
    .post_preview_gallery {
        width: 94%;
        -moz-column-count: 2;
        -webkit-column-count: 2;
        text-align: center;
    }
}

/*----------------------post_preview_styles_ends-----------------------*/

/*----------------------file upload button starts-----------------------*/
.fileUpload {
    position: relative;
    overflow: hidden;
    margin: 2px;
    float: left;
    padding-top: 17px;
    padding-bottom: 25px;
    color: white;
    background-color: #969595;
    width: 60px;
    text-align: center;
    text-decoration: underline;
}

.fileUpload input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
    width: 60px;
    height: 150px
}

.addButton {
    position: relative;
    top: -51px;
    right: 5px;
}

/*----------------------file upload button ends-----------------------*/

/*-------------------------navigation next - previous starts -------------------------*/
#first_form_page {
    display: block;
}

#second_form_page {
    display: none;
}

#third_form_page {
    display: none;
}

/*-------------------------navigation next - previous ends -------------------------*/
.addTagYesNoButtons {
    width: 90px;
    height: 28px;
    color: white;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    position: relative;
    padding-top: 2px;
}

.viewpostgallery img {
    width: 100%;
    padding: 2px 4px;
}

#addTagYesButton {
    float: left;
    background-color: #018a01;
}

#addTagNoButton {
    float: right;
    background-color: #920303;
}

.form_error_message {
    color: #b0b0b0;
    display: none;
    background: black;
    padding: 3px;
    border-radius: 3px;
    margin: auto 1em;
    width: fit-content;
}

.field_error_message {
    color: #b0b0b0;
    display: block;
    background: black;
    padding: 3px;
    border-radius: 3px;
    margin: auto 1em;
}
.field_error_message_payment {
    color: #ff0000;
    display: block;
    padding: 3px;
    border-radius: 3px;
}

#megap4choice a {
    color: white;
    text-decoration: none;
    display: block;
    width: 100%;
}

.black_px16 {
    color: black;
    font-size: 16px;
}

.red_px14 {
    color: #ff6600;
    font-style: italic;
    font-size: 14px;
}

.viewpostgallery video {
    width: 100%;
}

.writeuserPostDetailsContainer {
    margin-right: 15px;
    margin-left: -5px;
}

.galleryvideo video {
    margin: auto;
    display: block;
    max-width: 100%;
    width: 100%;
    padding: 4px;
}

h1.custom-h1 a {
    color: #9b00ff;
    font-size: 16px;
    font-weight: bold;
    font-family: arial;
}

h1.custom-h1 + footer {
    margin-top: 20px;
}

h1.custom-h1 {
    margin-top: 8px;
    font-size: 30px;
    font-weight: bold;
}

@media screen and (max-width: 420px) {
    #megap4AdSampleHeader {
        font-size: 20px;
    }

    .megap4choiceButtons {
        padding-top: 0;
        font-size: 20px;
        line-height: 32px;
    }

    #megap4choiceTopText {
        font-size: 11px;
        line-height: 1.2;
        width: 62%;
    }

    #megap4choiceTopText .found_mostrecent {
        font-size: 11px;
    }

    #megap4choice {
        margin: 5px auto -8px auto;
    }


}

/*----------------------front_page_first_styles_just_copy_paste_this_block_starts-----------------------*/
#front_page_post_free_button {
    position: relative;
    top: -22px;
    left: 10px;
}

.width-145 {
    width: 145px;
}

.width-285 {
    /* width: 285px; */
    margin: 0px auto 0px auto;
}

.width-385 {
    width: 385px;
    margin: 0px auto 0px auto;
}

.xtraBigMeetNow {
    color: #01d610;
    font-size: 39px;
    font-weight: 800;
    position: relative;
    top: -31px;
    left: 8%;
}

.italic {
    font-style: italic;
}

.brown {
    color: #b38f57;
}
.mp-red {
    color: red;
}
.mp-darkred {
    color: #a3514e;
}
.mp-orange {
    color: #fdb363;
}
.mp-orange--alt {
    color: #FEB463;
}
.mp-blue {
    color: #63c9fd;
}
.mp-blue--alt {
    color: #62C9FE;
}
.mp-darkblue {
    color: #0084c7;
}
.mp-gray {
    color: #6a6969;
}

.line-height-13 {
    line-height: 1.3;
}

.extraBigBlueButton {
    width: 286px;
    height: 50px;
    background-color: #305c85;
    color: white;
    margin: 32px auto 10px auto;
    padding: 3px 10px 10px 10px;
    text-align: center;
    font-size: 32px;
}

#meet_now_image {
    min-width: 215px;
    position: absolute;
    right: 0px;
}

.marg-top-45 {
    margin-top: 45px;
}

#frontPagetextBlockOne {
    width: 72%;
    margin: 36px auto 10px auto;
}

#frontPagetextBlockTwo {
    width: 80%;
    margin: -12px auto 18px auto;
}

#frontPagetextBlockThree {
    width: 72%;
    margin: 0px auto 10px auto;
}

.font-size-20 {
    font-size: 20px;
}

/*----------------------front_page_first_styles_just_copy_paste_this_block_ends-----------------------*/

/*----------------------front_page_second_styles_just_copy_paste_this_block_starts-----------------------*/
.megapCategoriesButtons {
    width: 100%;
    height: 49px;
    line-height: 49px;
    color: white;
    text-align: center;
    font-size: 31px;
    text-decoration: none;
    margin: 0px auto 16px auto;
    cursor: pointer;
}

.cap_wrap {
    display: flex;
    justify-content: flex-start;
    align-items: baseline;
    gap: 4px;
    max-width: 90%;
    margin: 8px auto;
}

.captcha_image {
    display: inline-block;
    width: 100%;
    max-width: 200px;
    float: left;
    position: relative;
    padding: 2px 2px;
    border: 2px solid gray;
    border-radius: 4px;
}

.captcha_image img {
    width: 100%;
    height: 100%;
    max-height: 36px;
    border-radius: 2px;
}

.replyCaptchaReloadButton {
    display: inline-block;
}

#postFormId .cap_wrap {
    margin: 0;
    margin-bottom: 8px;
}

#postFormId #captcha_code {
    margin: 0;
    margin-bottom: 12px;
}

@media screen and (max-width: 380px) {
    #postFormId .padd-0 {
        width: 100%;
    }
}

#captcha_code {
    text-transform: uppercase;
}

#captcha_code::placeholder {
    text-transform: none;
}

.form-input {
    max-width: 270px;
    margin-left: auto;
    margin-right: auto;
}

.contactus .cap_wrap, .replyform .cap_wrap {
    width: 90%;
    margin: auto;
}

.contactus .myButton, .myButton .cap_wrap, .enterphone .myButton {
    margin-top: 0.5em;
}

.loginform #contact_us_form {
    background: none;
    border: none;
}

.buglink {
    text-align: center;
    color: #f00;
    margin: -1em 0 2em;
}

.buglink a {
    color: #f00 !important;
}

#megapCategoriesPurpleButton {
    background-color: #611e58;
    margin-top: 42px;
}

#megapCategoriesBlueButton {
    background-color: #3b5998;
}

#megapCategoriesLightBlueButton {
    background-color: #1daced;
}

#post_an_ad_image {
    min-width: 197px;
    position: absolute;
    right: 22px;
    width: 85%;
}

/*----------------------front_page_second_styles_just_copy_paste_this_block_ends-----------------------*/

/*----------------------front_page_third_styles_just_copy_paste_this_block_starts-----------------------*/
.devilgirl_side {
    padding: 0 0 0 15px;
}

img.devilgirl_sidebar {
    position: absolute;
}

img.meetnow {
    margin: 10px 0;
}

.green {
    color: #21d42b;
}

.meetnow_byline {
    font-weight: bold;
    color: #dcd1b1;
    text-align: center;
    display: block;
    font-size: 20px;
    font-style: italic;
}

#megapCategoriesOrangeButton {
    background-color: #c75400;
    margin-top: 0;
}

#megapCategoriesYellowButton {
    background-color: #ffa300;
}

#megapCategoriesLightGreenButton {
    background-color: #e7c660;
}

#megapCategoriesGreenButton {
    background-color: #857a30;
}

#megapCategoriesGrayButton {
    background-color: #a6a3a3;
}

#megapCategoriesOrangeButton, #megapCategoriesYellowButton, #megapCategoriesLightGreenButton, #megapCategoriesGreenButton, #megapCategoriesGrayButton {
    border-radius: 3px;
}

#hookup_an_ad_image {
    width: 85%;
    padding: 4px 2px;
    background: #58c2fd;
    display: block;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    -webkit-box-shadow: 1px 4px 14px 0px rgba(50, 50, 50, 0.36);
    -moz-box-shadow: 1px 4px 14px 0px rgba(50, 50, 50, 0.36);
    box-shadow: 1px 4px 14px 0px rgba(50, 50, 50, 0.36);
    margin-left: 17px;
    margin-bottom: 9px;
    font-size: 18px;
    font-weight: bold;
}

@media screen and (max-width: 600px) {
    #hookup_an_ad_image {
        font-size: 2.8vw;
    }
}

.fp_buttons {
    padding-top: 4em;
}
.postadforfree_words_inner {
    position: absolute;
    top: 162px;
    width: 135px;
    left: 29px;
    z-index: 1;
    background-color: #58c2fd;
    padding: 4px 0px;
    text-align: center;
    color: white!important;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 1px 4px 4px 0px rgba(50, 50, 50, 0.36);
    border-radius: 5px;
}

@media screen and (max-width: 600px) {
    .postadforfree_words_inner {
        font-size: 2.8vw;
    }
}

.third_page_shadowed_buttons {
    -webkit-box-shadow: 1px 4px 14px 0px rgba(50, 50, 50, 0.46);
    -moz-box-shadow: 1px 4px 14px 0px rgba(50, 50, 50, 0.46);
    box-shadow: 1px 4px 14px 0px rgba(50, 50, 50, 0.46);
}

/*----------------------front_page_third_styles_just_copy_paste_this_block_ends-----------------------*/

.changeCityLink {
    cursor: pointer;
    display: block;
    color: #a9b5d5;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    text-decoration: underline;
    margin-bottom: 12px;
}

/*-------------city choice starts---------------------*/

#cityChoicePopUp {
    position: absolute;
    z-index: 12500;
    width: 310px;
    max-height: 100%;
    margin-top: 12px;
}

@media screen and (max-width: 320px) {
    #cityChoicePopUp {
        width: 220px;
    }
    .ac-label__level1 {
        font-size: 1.1em !important;
    }
}

#postCostPopUp {
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 12500;
    width: 100%;
    height: 100%;
}

#cityChoicePopUpWindow {
    position: absolute;
    top: 150px;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    background-image: url('../img/MPcityChoiceWhiteBgv1_345.png');
    width: 345px;
    height: 295px;
}

#youre_viewing_ads_from {
    position: absolute;
    top: 160px;
    top: 150px;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);;
    width: 345px;
    height: 215px;
}

#youre_post_price {
    position: absolute;
    width: 345px;
    height: 215px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#youre_viewing_ads_from_top_part {
    position: absolute;
    top: 0px;
    left: 00px;
    background-image: url('../img/you_are_viewing_345.png');
    background-repeat: no-repeat;
    width: 345px;
    height: 152px;
}

#enter_ver_codde_background {
    position: absolute;
    top: 0px;
    left: 00px;
    background-image: url('../img/enter_verif_code.png');
    background-repeat: no-repeat;
    width: 345px;
    height: 152px;
}

#post_will_cost_central_part {
    position: absolute;
    font-size: 16px;
    top: 0px;
    left: 0px;
    background: #404040;
    border-radius: 10px;
    width: 345px;
    height: 146px;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding-top: 1.5em;
    -webkit-box-shadow: 0px 10px 29px 0px rgba(0, 0, 0, 0.34);
    -moz-box-shadow: 0px 10px 29px 0px rgba(0, 0, 0, 0.34);
    box-shadow: 0px 10px 29px 0px rgba(0, 0, 0, 0.34);
}

#post_will_cost_central_part span {
    color: #fff261;
}

#post_will_cost_central_part p {
    margin-bottom: 20px;
}

.tokenpop {
    opacity: 0 !important;
}

.spinner {
    color: #fdf41b;
    align-items: center;
    justify-content: center;
}
.spinner:after {
    animation: changeContent .8s linear infinite;
    content: "⠋";
    font-size: inherit;
}
@keyframes changeContent {
    10% { content: "⠙"; }
    20% { content: "⠹"; }
    30% { content: "⠸"; }
    40% { content: "⠼"; }
    50% { content: "⠴"; }
    60% { content: "⠦"; }
    70% { content: "⠧"; }
    80% { content: "⠇"; }
    90% { content: "⠏"; }
}

.pinkok {
    background: #d8006d;
    display: block;
    clear: both;
    margin: auto;
    width: 140px;
    border-radius: 8px;
    font-size: 18px;
    font-weight: bold;
}

#youre_viewing_ads_from_top_part_city_name {
    color: #39bafd;
    font-size: 29px;
    font-family: Verdana;
    position: relative;
    top: 54px;
    font-weight: bold;
    margin: 0 auto;
    text-align: center;
}

#enter_ver_codde {
    color: #39bafd;
    font-size: 19px;
    font-family: Verdana;
    position: relative;
    top: 25px;
    font-weight: bold;
    margin: 0 auto;
    text-align: center;
}

#youre_viewing_ads_from_bottom_part {
    position: absolute;
    bottom: -4px;
    left: 0px;
    background-image: url('../img/MPchangeCityChangev1_345.png');
    background-repeat: no-repeat;
    width: 345px;
    height: 70px;
}

#cityChoicePopUpWindowStates {
    position: relative;
    top: 55px;
    left: 33px;
    background-image: url('../img/MPcityChoiceUsBtnv1_345.png');
    width: 280px;
    height: 32px;
}

select#canadaDropDown, select#statesDropDown {
    font-size: 0px;
}

#statesDropDown {
    border: 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url('../img/MPcityChoiceUsBtnv1_345.png');
    width: 280px;
    height: 32px;
    color: #FFF;
    padding: 5px;
}

#statesDropDown option {
    background: #2d4f88;
    font-size: 14px;
}

#cityChoicePopUpWindowCanada {
    position: absolute;
    top: 101px;
    left: 33px;
    background-image: url('../img/MPcityChoiceCanadaBtnv1_345.png');
    width: 280px;
    height: 32px;
}

#canadaDropDown {
    border: 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url('../img/MPcityChoiceCanadaBtnv1_345.png');
    width: 280px;
    height: 32px;
    color: #FFF;
    padding: 5px;
}

#canadaDropDown option {
    background: #2d4f88;
    font-size: 14px;
}

#cityChoicePopUpWindowEurope {
    position: absolute;
    top: 147px;
    left: 33px;
    background-image: url('../img/MPcityChoiceEuroBtnv1_345.png');
    width: 280px;
    height: 32px;
}

#europeDropDown {
    border: 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url('../img/MPcityChoiceEuroBtnv1_345.png');
    width: 280px;
    height: 32px;
    color: #FFF;
    padding: 5px;
}

#europeDropDown option {
    background: #2d4f88;
    font-size: 14px;
}

#cityChoicePopUpWindowAustralia {
    position: absolute;
    top: 193px;
    left: 33px;
    background-image: url('../img/MPcityChoiceAustralBtnv1_345.png');
    width: 280px;
    height: 32px;
}

#australiaDropDown {
    border: 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url('../img/MPcityChoiceAustralBtnv1_345.png');
    width: 280px;
    height: 32px;
    color: #FFF;
    padding: 5px;
}

#australiaDropDown option {
    background: #2d4f88;
    font-size: 14px;
}

#cityChoicePopUpWindowNewZel {
    position: absolute;
    top: 239px;
    left: 33px;
    background-image: url('../img/MPcityChoiceNZBtnv1_345.png');
    width: 280px;
    height: 32px;
}

#newZelDropDown {
    border: 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url('../img/MPcityChoiceNZBtnv1_345.png');
    width: 280px;
    height: 32px;
    color: #FFF;
    padding: 5px;
}

#newZelDropDown option {
    background: #2d4f88;
    font-size: 14px;
}

.mpcityname {
    cursor: pointer;
    display: block;
    color: #810107;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    margin-top: 4px;

}

.frontpage {
    margin-top: 10px;
}

/*-------------pagination starts---------------------*/

.paginationwrapper {
    text-align: center;
    width: 100%;
    display: block;
}

.paginationwrapper_inner {
    display: inline-block;
    margin: auto;
}

.wholePaginationBlock {
    text-align: center;
    margin: 0px auto 0px auto;
    padding: 5px;
}

.paginationUnactiveNewArrow {
    float: left;
}

.paginationUnactiveNew {
    float: left;
    width: 45px;
}

.paginationActiveNew {
    float: left;
    width: 35px;
}

.paginationUnactiveNew {
    float: left;
    width: 35px;
}

.paginationUnactiveNewDots {
    float: left;
    width: 14px;
    color: #a9b6d4;
    font-weight: bold;
}

.paginationUnactiveNewDots.prevdots {
    margin-right: 5px;
}

a.pageNumbersNew {
    display: inline-block;
    height: 2em;
    font-weight: bold;
    text-decoration: none;
    font-size: 13px;
    color: #01469c;
    font-weight: bold;
    padding-bottom: 1px;
}

#paginationNext {
    width: 50px;
    height: 30px;
    line-height: 30px;
    color: #a9b6d4;
}

#paginationNext:hover,
a.pageNumbersNew:hover {
    cursor: pointer;
}

#paginationPrevious {
    width: 50px;
    height: 30px;
    line-height: 30px;
    color: #a9b6d4;
}

.pagin_placeholder {
    width: 84px;
    float: left;
}

.paginationFigureUnactive, #paginationFigureUnactive,
.pageNumbersNew.ng-binding {
    display: block;
    width: 25px;
    height: 25px;
    background: #ffffff;
    color: #a9b6d4;
    padding: 0;
    line-height: 25px;
    border: 1px solid #a9b6d4;
}

.paginationFigureActive {
    display: block;
    width: 25px;
    height: 25px;
    background: #a9b6d4;
    color: white;
    line-height: 25px;
}

/*-------------pagination ends---------------------*/

/*-------------city choice ends---------------------*/

.subcategoryName {
    color: #01d610;
    font-size: 31px;
    font-family: Arial;
    float: right;
    position: relative;
    top: 45px;
    font-weight: bold;
}

.meetNow {
    color: #01d610;
    font-size: 26px;
    font-family: Arial;
    float: right;
    position: relative;
    top: 27px;
    right: 10px;
    font-weight: bold;
}

#bottom_container {
    max-width: 600px;
    position: fixed;
    bottom: 12px;
    margin: 0px auto;
    z-index: 1000;
}

#bottom_container_buy_tokens {
    width: 100%;
    max-width: 600px;
    position: fixed;
    bottom: 0px;
    margin: 0px auto;
    z-index: 900;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    display: none;

}

#ageCheckPopupInner {
    width: 600px;
    max-width: 100%;
    height: 97vh;
    margin: auto;
    padding: 1em 2.8em 40px;
    z-index: 2000;
    position: relative;
    background: url('../img/agepopup_bg.png') no-repeat;
    background-size: 100% 100%;
    color: #4f0202;
}

#ageCheckPopupInner .terms-container {
    border: 4px inset lightgray;
    padding: 0 12px;
    max-height: calc(100% - 344px);
    overflow: auto;
    color: #555555;
}

@media screen and (max-width: 600px) {
    #ageCheckPopupInner .terms-container {
        max-height: calc(100vh - 60vw - 60px);
    }
}

.terms-container .checkbox {
    text-align: center;
}
.terms-container .checkbox label {
    display: inline-flex;
    align-items: center;
}
.terms-container .checkbox label input {
    width: 24px;
    height: 24px;
    accent-color: forestgreen;
}
.terms-container .checkbox label span {
    margin-left: 14px;
    text-align: left;
}

#ageCheckPopupInner h1 {
    font-weight: bold;
    font-size: 36px;
    letter-spacing: -1px;
    text-align: center;
}

#ageCheckPopupDiv {
    background-position: 50% 0%;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #fbfefa;
    z-index: 13000;
    top: 0;
    overflow-y: scroll;
}

#ageCheckPopupDiv > #ageCheckPopupInner > ul {
    font-size: 14px;
    font-family: Arial;
    color: darkgray;
    margin-right: 5px;
    text-align: justify;
    font-weight: 600;
}

#ageagree, #postagree {
    background-color: #cca3b6;
    border-color: #917482;
    color: black;
    text-transform: uppercase;
    font-weight: bold;
}

#postrequirementsagree {
    color: black;
    text-transform: uppercase;
    font-weight: bold;
}

#ageCheckPopupDiv > #ageCheckPopupInner a:link {
    color: #68a2b4;
}

#ageCheckPopupInner .centered {
    /* margin: 0 0 15px 0; */
}

.agecake {
    text-align: center;
    margin-top: 15px;
}

.agecake > img {
    width: 45%;
}

#ageCheckPopupDiv > #ageCheckPopupInner > ul > li {
    list-style-type: none;
    margin: 8px 0 0 -28px;
}

#ageCheckPopupDiv > #ageCheckPopupInner > ul > li::before {
    content: '\2981';
    margin: 0 8px 0 -12px;
    color: #fe8d8d;
    font-weight: 900;
}

.you_have_tokens {
    width: 30%;
    height: 6em;
    float: right;
    background: url('../img/cornerHUD.png') no-repeat;
    background-color: transparent;
    background-size: 100% 100%;
}

.you_have_tokens a:hover {
    text-decoration: none;
}

.buy_more_tokens {
    float: right;
    width: auto;
    text-align: center;
    height: 50px;
    line-height: 50px;
    display: inline-block;
}


#bottom_container_buy_tokens span {
    color: #666;
    font-size: 23px;
    display: block;
    width: 100%;
    text-align: center;
    padding-right: 37%;
    line-height: 3em;
}

footer {
    color: #046aaf;
    font-family: Verdana;
    font-size: 12px;
    margin-top: 16px;
    padding-bottom: 32px;
}

footer .pager li > a {
    padding: 2px 0px 2px 0px;
    margin: 2px -2px 2px -1px;
    color: #046aaf;
    border: none;
}

#bottom_button_container {
    float: left;
    margin: 0px 0px 5px -9px;
    padding: 0px 0px 0px 0px;
}
#copyrigh {
    width: 100%;
    text-align: center;
    margin-top: 8px;
}

.copyright_class {
    width: 100%;
    text-align: center;
    margin-top: -18px;
}
.copyright_class_term {
    margin-top: 20px;
    margin-bottom: 20px;
}
/*--------------links-------------------*/

a.linksUnderButton {
    font-size: 14px;
    font-weight: bold;
    color: #b8b8b8;
    text-decoration: none;
}

#three_button_header {
    position: fixed;
    z-index: 300;
    max-width: 600px;
    padding-top: 0px;

    background: #ff4600; /* Old browsers */
    background: -moz-linear-gradient(top, #ff4600 55%, #fe9000 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ff4600 55%, #fe9000 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ff4600 55%, #fe9000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4600', endColorstr='#fe9000', GradientType=0); /* IE6-9 */

}

.zero-padding-top {
    padding-top: 0px;
}

#body_border {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: -1000;

}

nav .pager li > a, .pager li > span {
    background-color: initial;
}

nav .pager li > a:hover, .pager li > span {
    background-color: initial;
}

/*manage post*/
/* Height used to be a fixed 480px with .managebutton_wrapper transformed 284px down
   into it — transform doesn't affect box size, so any content taller than the leftover
   space (e.g. the robot button's own row plus its timer) rendered past the bottom edge
   and got clipped by, or clipped into, #manage_ad_body right below. Auto height with the
   284px as real padding instead means the box always grows to fit whatever's inside. */
#managepost_header {
    position: relative;
    width: 100%;
    max-width: 600px;
    height: auto;
    min-height: 480px;
    /* The devil-girl illustration + "Manage Posts" ribbon baked into the
       background art sit in roughly the top 55% of that image. Since
       background-size:100% 100% stretches it to this box's own (variable)
       height, that artwork occupies the same ~55% share of whatever height
       this box ends up — 284px, then 320px, still wasn't enough clearance
       below it once the button grid's real height was accounted for, so the
       top row rendered over the ribbon/girl instead of below it. */
    padding-top: 360px;
    padding-bottom: 0;
    box-sizing: border-box;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-image: url('../images/megapersonalsHeaderBackground.png');
}

@media screen and (max-width: 600px) {
    #managepost_header {
        min-height: 78vw;
        padding-top: 60vw;
        padding-bottom: 0;
    }
}

#managepost_header.extended-payment {
    height: 404px;
    margin-bottom: 96px;
}

@media screen and (max-width: 600px) {
    #managepost_header.extended-payment {
        height: calc(35vw + 160px);
    }
}

.manage_flowers {
    max-width: 147px;
    width: 27%;
}

.manage_header {
    position: absolute;
    width: 70%;
    z-index: 2000;
    top: 14px;
    right: 10px;
}

#manageTopText {
    text-align: right;
    padding: 0 40px 0;
    margin: -3em 0 1.5em 0;
    font-weight: bold;
    font-style: italic;
}

#manageTopText span {
    color: #fff;
}
#confirmModal,
.after-form-modal,
#confirmModal_enoughTokens,
#confirmModal_notPublished,
#verificationModal_notPublished,
#confirmModal_Not_enoughTokens,
#confirmModal_verification,
#successModal_verification,
#confirmModal_BuyMoreTokens,
#c3_Account_Migration,
#remove-post {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2001;
    background: #757575b5;
    display: flex;
    justify-content: center;
    align-items: center;
}
#orderPlacingModal_verification {
    background: #0000008f;
    z-index: 2002;
}
#myModal .after-form-modal {
    background: none;
}
.after-form-modal img,
#confirmModal_enoughTokens img,
#confirmModal_notPublished img,
#confirmModal_Not_enoughTokens img,
#confirmModal_BuyMoreTokens img {
    width: 100%;
}

#confirmModal_verification img {
    width: 80%;
    margin-top: -15px;
    margin-left: -12px;
}

.after-form-modal .modal-content,
#confirmModal_enoughTokens .modal-content,
#confirmModal_Not_enoughTokens .modal-content,
#confirmModal_BuyMoreTokens .modal-content,
#confirmModal_verification .modal-content,
#remove-post .modal-content,
#c3_Account_Migration .modal-content {
    padding: 26px 20px;
    background: linear-gradient(160deg, #4a4652 0%, #322f3a 100%);
    color: #fff;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, .08);
    box-shadow: 0 16px 40px rgba(0, 0, 0, .5);
}

#tokens {
    cursor: pointer;
}

#confirmModal_notPublished .modal-content {
    padding: 3px 29px 18px 29px;
    border-radius: 16px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .35);
}

#confirmModal_notPublished .modal-body {
    margin-bottom: -23px;
}

#confirmModal_notPublished .notPblsht,
#verificationModal_notPublished .notPblsht {
    background: linear-gradient(135deg, #ffcf7a 0%, #f9a61c 100%);
    cursor: pointer;
}

#verificationModal_notPublished .notPblsht a {
    color: white;
}

#verificationModal_notPublished .modal-content {
    padding-bottom: 16px;
}

.disabledbutton {
    pointer-events: none;
    opacity: 0.4;
}

.disabledlink {
    pointer-events: none;
    opacity: 0.7;
}

.payment-providers .submit-block {
    display: flex;
    flex-direction: column;
    max-width: 144px;
    gap: 12px;
}
.payment-providers .submit-block button.btn {
    text-transform: uppercase;
}

#confirmModal_Not_enoughTokens .modal-body,
#confirmModal_BuyMoreTokens .modal-body {
    padding-bottom: 0;
    padding-top: 0;
}

#confirmModal_Not_enoughTokens .flex-btn,
#confirmModal_BuyMoreTokens .flex-btn{
    padding: 0;
    margin-top: -10px;
}

#confirmModal_enoughTokens .modal-body,
#confirmModal_notPublished .modal-body {
    margin: -20px 12px;
}

.verification-radiance-brown-text {
    color: #5d1515; 
    text-shadow: 0 0 4px #d48282; 
    font-size: 14pt;
}

.verification-radiance-green-text {
    color: darkgreen; 
    text-shadow: 0 0 4px #d48282;
}

.modal-content-white {
    background: white !important;
}

.modal-white {
    padding: 25px;
    background: #404040;
    color: #fff;
}

#confirmModal_enoughTokens p:nth-child(1),
#confirmModal_notPublished p:nth-child(1),
#verificationModal_notPublished p:nth-child(1) {
    margin-bottom: 3px;
}

#confirmModal_notPublished.notPublished {
    background: none;
    display: block;
    margin: auto;
    max-width: 330px;
    top: 20%;
}

#verificationModal_notPublished.notPublished {
    background: none;
    display: block;
    margin: auto;
    max-width: 330px;
    top: 20%;
}

#close-notEnough-popup,
#close-enough-popup,
#close-buyMore-popup,
.close-post-form-popup {
    width: 26px;
    display: block;
    position: absolute;
    bottom: 8px;
    right: 8px;
    cursor: pointer;
    opacity: .85;
    transition: opacity .15s ease, transform .15s ease;
}
#close-notEnough-popup:hover,
#close-enough-popup:hover,
#close-buyMore-popup:hover,
.close-post-form-popup:hover {
    opacity: 1;
    transform: scale(1.08);
}
#close-popup-up {
    width: 34px;
    display: block;
    position: absolute;
    top: -3px;
    right: -6px;
}
#c3_Account_Migration h4 {
    font-family: Arial, sans-serif;
    font-weight: 700;
    font-size: 1.2em;
    margin: 6px 0 4px;
}
#close-c3-notify-account-popup {
    display: inline-block;
    border: none;
    border-radius: 999px;
    color: #fff;
    font-weight: 700;
    font-size: 1.1em;
    min-width: 120px;
    padding: 10px 26px;
    margin-top: 10px;
    cursor: pointer;
    background: linear-gradient(135deg, #6bdb8f 0%, #049800 100%);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
    transition: transform .12s ease, box-shadow .15s ease;
}
#close-c3-notify-account-popup:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
}

/* Rare edge-case popups (fraud/limit block, account deletion) get the same
   rounded-card polish as the rest without touching Bootstrap's shared
   .modal-content/.btn base classes used elsewhere on the site. */
#exceed-payment-limit-modal .modal-content,
#delete-account-modal .modal-content {
    border-radius: 14px;
    border: none;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .35);
    overflow: hidden;
}
#exceed-payment-limit-modal .modal-footer,
#delete-account-modal .modal-footer {
    justify-content: center;
    gap: 10px;
    border-top: none;
    padding-bottom: 18px;
}
.flex-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0 5%;
    justify-content: space-around;
    gap: 12px;
    flex-wrap: wrap;
}
.flex-btn-row {
    display: flex;
    flex-direction: column;
}
.managechoiceButtons {
    background-size: contain;
    width: 100%;
    line-height: 50px;
    font-family: 'Oswald', sans-serif;
    cursor: pointer;
    text-decoration: none;
}
.managechoiceButtonsWrapp{
    width: 49%;
}
.acceptBnt,
.buyMoreBnt,
.notPblsht,
.acceptBnt-remove,
#close-remove-popup {
    display: inline-block;
    border-radius: 999px;
    text-align: center;
    color: #fff;
    font-weight: 700;
    font-size: 1.2em;
    min-width: 140px;
    padding: 12px 24px;
    margin-top: 14px;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
    transition: transform .12s ease, box-shadow .15s ease;
}
.acceptBnt:hover,
.buyMoreBnt:hover,
.notPblsht:hover,
.acceptBnt-remove:hover,
#close-remove-popup:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .4);
}
.buyMoreBnt {
    background: linear-gradient(135deg, #5b9dff 0%, #2755f0 100%);
    padding: 12px 24px;
}
.acceptBnt-remove {
    background: linear-gradient(135deg, #ffb066 0%, #df5e29 100%);
}
.acceptBnt,
#close-remove-popup {
    background: linear-gradient(135deg, #6bdb8f 0%, #049800 100%);
}
.floatie-wrapper {
    position: fixed;
    margin: 0 auto;
    bottom: 0;
    pointer-events: none;
    z-index: 10;
}
.token-floatie {
    position: relative;
    float: right;
    font-family: arial;
    max-width: 100px;
    font-weight: bold;
    margin: 0 12px 4px 0px;
    pointer-events: all;
    transform: scale(1.06);
    /* filter: drop-shadow(2px 2px 6px grey); */
    pointer-events: all;
}
.token-floatie img {
    width: 100%;
}
.tokens-floatie-amount{
    position: absolute;
    bottom: 15px;
    left: 13px;
    z-index: 1;
    font-size: 1.5em;
    color: #3f0506;
}
.tokens-floatie-amount > .centered {
    width: 40px;
    font-weight: bold;
    font-family: "Arial";
    font-size: 23px;
    height: 29px;
}
.scrollTopWrapper {
    position: fixed;
    bottom: 16px;
    width: 100%;
    pointer-events: none;
    z-index: 1;
}
.scrollTopWrapper .button-arrow-top {
    height: 40px;
    width: 40px;
    border-radius: 13px;
    cursor: pointer;
    margin: auto;
    pointer-events: all;
    background-color: #ff64b173;
    display: flex;
    justify-content: center;
    align-items: center;
    transition-duration: .2s;
    box-shadow: 0 0 9px 0px #0000008a;
}
.scrollTopWrapper .button-arrow-top:hover {
    transition-duration: .2s;
}
.scrollTopWrapper .button-arrow-top .arrow-sign-up {
    height: 12px;
    width: 12px;
    border: solid #ffffffb5;
    border-width: 0 3px 3px 0;
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}
.scrollTopWrapper .button-arrow-top:active {
    box-shadow: none;
    transition-duration: .2s;
    transform: scale(.85);
}

/* Persistent support bubble — links out to WhatsApp under the hood, but
   styled as a generic support control (headset icon, plain green rather
   than WhatsApp's own green/teal gradient) rather than WhatsApp-branded.
   One of three fixed controls sharing the
   screen edges here alongside the logout pill (footer#footer nav ul, pinned
   bottom-left) and the back-to-top arrow (.scrollTopWrapper, above, centered
   on wider screens and parked off-screen at bottom:-110px on this page).
   Bottom-right at every width; the mobile query further down only shrinks the
   bubble and pushes the days-remaining badge up off this corner so the two
   stop landing on each other.

   The circle and its "Soporte" caption are two stacked children of this fixed
   wrapper rather than the circle itself being fixed — that way the caption's
   own height is part of what the layout has to clear, and the badge-stacking
   math below only has to read one number (the wrapper's height) instead of a
   circle plus a separately-positioned label. */
.support-fab-wrap {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 1500;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.support-fab {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #34c759 0%, #1f8f3d 100%);
    box-shadow: 0 3px 10px rgba(0, 0, 0, .25);
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    outline: none;
    -webkit-tap-highlight-color: transparent;
}

/* Small pill rather than bare text — this sits on top of page content (fixed,
   not in the document flow), and page content varies in color, so plain text
   would lose contrast against whatever happens to scroll underneath it. Same
   white-pill-with-pink-border language as .logout-pill uses for the same
   reason. */
.support-fab-label {
    background: #ffffff;
    color: #aa1f54;
    border: 2px solid #ff86c7;
    border-radius: 999px;
    padding: 3px 10px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .2);
}

@media screen and (max-width: 600px) {
    /* Bottom-right corner, same as desktop — just a smaller bubble. This used to
       be anchored to the vertical middle (top:50%) to dodge the days-remaining
       badge, which shares this corner on narrow screens and outranks this button
       on z-index, so it covered it on short pages. The badge moves up out of the
       way instead now (below), which keeps both reachable without exiling this
       one to the middle of the screen. */
    .support-fab-wrap {
        right: 12px;
        bottom: 18px;
        gap: 4px;
    }
    .support-fab {
        width: 46px;
        height: 46px;
    }
    .support-fab svg {
        width: 24px;
        height: 24px;
    }
    /* Same translucent-pink-wash treatment .logout-pill switches to on phones,
       for the same reason: a solid white fill would block whatever's scrolled
       underneath this fixed pill. */
    .support-fab-label {
        background: rgba(255, 134, 199, .28);
        border-width: 1.5px;
        color: #fff;
        text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
        box-shadow: none;
        font-size: 11px;
        padding: 2px 8px;
    }
    /* The licencia badge stacks directly above this wrapper on mobile — those
       rules live further down, after .days-remaining-badge-floating's own
       declarations, since a media query adds no specificity and an override
       written up here would just lose to the later rule on source order. The
       wrapper's total height (46px circle + 4px gap + ~17px label) is what
       those offsets are measured from. */
    .scrollTopWrapper {
        width: auto;
        right: 12px;
    }
    .scrollTopWrapper .button-arrow-top {
        margin: 0;
        width: 34px;
        height: 34px;
    }
}

div.managechoiceButtonsWrapp{
    width: 49%;
    line-height: 60px;
}

#manageEditButton {
    /*background: url('../img/managebutton_edit.png') no-repeat;*/
    background-size: contain;
}

#manageRemoveButton {
   /* background: url('../img/managebutton_remove.png') no-repeat;*/
    background-size: contain;
}

#manageWriteNew {
    /* background: url('../img/managebutton_writenew.png') no-repeat;*/
    background-size: contain;
}

#manageRepostAd {
    /*background: url('../img/managebutton_bump.png') no-repeat;*/
    background-size: 100% 100%;
    float: right;
}

#manageBumpAd {
    background: url('../img/managebutton_bump.png') no-repeat;
    background-size: 100% 100%;
    float: right;
}

.managepostpage #megap4AdSampleContent p, .managepostpage #megap4AdSampleContent ul {
    margin: 10px;
}

.managebutton_wrapper {
    /* A little wider than before (was calc(100% - 50px)) and a slightly
       tighter gap (was 16px) — both give Remove Post/Bump to Top more room to
       sit on one line inside their buttons instead of wrapping to two. */
    width: calc(100% - 24px);
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    gap: 10px;
    /* Offset used to live here as a transform; it's now #managepost_header's
       padding-top instead, so the header's own height always accounts for it. */
}

/* Edit Post/Write New only (the wrapper's first two .manage-button children) —
   a little clearance above the top row, separate from .managebutton_wrapper's
   own gap since that gap is shared between every row, not just above the
   first one. */
.managebutton_wrapper > .manage-button:nth-child(-n+2) {
    margin-top: 10px;
}

.extended-payment .managebutton_wrapper {
    transform: translateY(340px);
}

/* .days-remaining-wrap is a normal in-flow row right under .post-pager (see
   Views/Post/Index.cshtml) — not absolutely positioned against the pager
   card, which twice ran into the badge landing somewhere it wasn't actually
   visible (stacking/overflow with whatever sits below the pager). Matches
   .post-pager's own width/max-width/centering so the badge still lines up
   under the card's right edge; justify-content pushes it there since the
   badge is this row's only child. */
.days-remaining-wrap {
    position: relative;
    width: 95%;
    max-width: 500px;
    margin: 8px auto 0;
    display: flex;
    justify-content: flex-end;
}

/* Plain in-flow flex child of .days-remaining-wrap now, not absolutely
   positioned — see that rule's own comment for why. The artwork itself is a
   generic token-balance graphic with a blank pill next to the coin; the
   number (.days-remaining-value below) is overlaid on that blank area — its
   position is a % of this element's own box, which is sized by the image
   inside it. Clickable (see .subscription-popover below) so pointer-events
   is back to the default rather than none. */
.days-remaining-badge {
    position: relative;
    width: clamp(50px, 13vw, 76px);
    /* .post-pager sits near the bottom of the page, same screen region
       .support-fab is fixed to — with z-index:5 the badge sat underneath
       that button (z-index:1500) whenever scroll position brought the two
       into the same spot, so clicks meant for the badge hit the fixed
       button instead and never reached it at all (not just an already-open
       popover being hidden — the click never registered on the badge). */
    z-index: 1550;
    cursor: pointer;
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .25));
}

/* No pager to sit next to when there's only one post, so this variant stays
   pinned to the viewport instead — lined up with the right edge of
   .bump-timer-wrap above (same width:95%/max-width:500px centered card) the
   same way the other badge variant lines up with the right edge of the pager
   card, rather than dead-center or the plain viewport corner. */
.days-remaining-badge-floating {
    position: fixed;
    bottom: 16px;
    right: max(2.5vw, calc(50vw - 250px));
    width: clamp(90px, 20vw, 130px);
    z-index: 1550;
    cursor: pointer;
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .25));
}
.days-remaining-badge img {
    width: 100%;
    display: block;
    pointer-events: none;
}
.days-remaining-value {
    position: absolute;
    left: 16%;
    top: 43%;
    width: 40%;
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 800;
    font-size: clamp(11px, 3.6vw, 15px);
    color: #7a4a00;
    line-height: 1;
    pointer-events: none;
}
.days-remaining-badge-floating .days-remaining-value {
    font-size: clamp(13px, 4.2vw, 17px);
}
.days-remaining-unit {
    font-size: 1.1em;
    font-weight: 900;
    margin-left: 1px;
}

/* Click-to-reveal subscription end date — a small anchored card near the badge
   rather than a centered full-screen modal (no dark backdrop, no
   dismiss-everything overlay), closer to how a native context menu behaves.
   Same two-layer look as .post_title/.post_title_caption: an outer tan-bordered
   box around an inner white, pink-bordered one — and the same bold/uppercase
   text as .post_header, rather than the dark purple modal look used elsewhere
   on this page. Anchored to .days-remaining-wrap (position:relative, see
   above) rather than .post-pager directly — that div is sized to exactly fit
   the badge, so top:100% opens right under it with no extra clearance math
   needed; fixed near the floating badge when there's no pager instead. */
.subscription-popover {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 10px;
    /* .post-pager sits just above the footer, so this opens right into the
       same bottom-of-screen area .support-fab is fixed to. z-index:6 lost to
       that button's z-index:1500 — the popover was rendering, just hidden
       underneath it — so this needs to clear it. */
    z-index: 1600;
    padding: 4px;
    background: #faf4d8;
    border: 3px solid #d2c4bd;
    border-radius: 18px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, .35);
    max-width: 260px;
}
.subscription-popover-floating {
    position: fixed;
    /* The base rule's top:100% is meant for the pager-anchored variant, where
       it's relative to the small .post-pager card. Left in place here, it
       means 100% of the *viewport* height instead (position is now fixed) —
       pinning the top edge to the very bottom of the screen, below this
       rule's own bottom:108px. That inverted top/bottom pair collapsed the
       box to zero height: right content, right classes, nothing visible. */
    top: auto;
    bottom: 108px;
    right: max(2.5vw, calc(50vw - 250px));
}
.subscription-popover.subscription-popover-open {
    display: block;
}
.subscription-popover-inner {
    position: relative;
    background: #ffffff;
    color: black;
    border: 3px solid #ff86c7;
    border-radius: 14px;
    padding: 16px 18px 14px;
    font-family: Arial, Helvetica, sans-serif;
    text-align: center;
    line-height: 1.4;
}
.subscription-popover-heading {
    font-size: 13px;
    font-weight: 700;
    color: #aa1f54;
    margin-bottom: 6px;
}
.subscription-popover-date {
    font-size: 12px;
    font-weight: 800;
    color: black;
    white-space: nowrap;
}
.subscription-popover-remaining {
    margin-top: 8px;
    font-size: 11px;
    font-weight: 600;
    color: #888;
}
.subscription-popover-close {
    position: absolute;
    top: 2px;
    right: 6px;
    background: none;
    border: 0;
    color: black;
    opacity: .6;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}

/* No mobile override for .managebutton_wrapper: the Edit/Write New/Remove/Bump to
   Top/Pausar row is meant to look the same on phones as on desktop, so it keeps the
   base calc(100% - 24px) width and 10px gap at every viewport. The buttons inside
   are sized in %, so they still scale down with the screen — they just don't switch
   to a different (tighter, smaller-radius, vw-typed) look below 600px. */
@media screen and (max-width: 600px) {
    #manage_ad_body {
        margin-top: 30px;
    }

    /* Soporte + licencia as one bottom-right stack on phones: .support-fab-wrap in
       the corner (18px up, ~67px tall — 46px circle + 4px gap + ~17px "Soporte"
       label) and this badge parked directly above it with a ~26px gap, both flush
       to right:12px. That means overriding BOTH variants — the pager-anchored one
       (position:relative, normally just an in-flow row under .post-pager — see
       .days-remaining-wrap) and the fixed/floating one — into the same fixed
       spot, so the pair looks identical whether or not the
       client has enough posts to get a pager. right:12px rather than the floating
       variant's max(2.5vw, calc(50vw - 250px)): that expression is meant to line
       the badge up with the right edge of the .bump-timer-wrap card, and between
       500px and 600px wide it resolves to as much as 50px, which would leave the
       badge visibly indented from the wrapper underneath it instead of stacked
       on it.

       This block has to sit after .days-remaining-badge-floating /
       .subscription-popover-floating in source order — same specificity, and a
       media query adds none of its own. */
    .days-remaining-badge,
    .days-remaining-badge-floating {
        position: fixed;
        top: auto;
        bottom: 112px;
        right: 12px;
        width: clamp(90px, 20vw, 130px);
    }

    .days-remaining-badge .days-remaining-value {
        font-size: clamp(13px, 4.2vw, 17px);
    }

    /* Carried up by the badge's own height plus a gap so the popover still opens
       clear of the badge that owns it. Both variants again: the pager-anchored one
       is absolute against .days-remaining-wrap by default, which is no longer
       where its badge is on phones. */
    .subscription-popover,
    .subscription-popover-floating {
        position: fixed;
        top: auto;
        bottom: 204px;
        right: 12px;
        margin-top: 0;
    }
}

@media screen and (min-width: 321px) and (max-width: 600px) {
    .extended-payment .managebutton_wrapper {
        transform: translateY(calc(25vw + 160px));
    }
}

@media screen and (max-width: 320px) {
    .extended-payment .managebutton_wrapper {
        transform: translateY(calc(25vw + 194px));
    }
}

.managebutton_wrapper img {
    width: 100%;
}

/* Wraps the Pause/Start Robot control together with its countdown so the two stack
   as one flex cell. Wider than the other four buttons (44%) rather than matching
   them: it's alone in its own row already (flex-wrap drops it there once it can't
   share a row with the pair above), and this is the width the artwork below is
   sized against. */
.robot-control-cell {
    width: 92%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

/* The Start/Pause control (Views/Post/Index.cshtml) is a supplied banner image —
   empezar-anuncio.png / pausar-anuncio.png — not a .manage-button with a text
   label. The artwork carries its own gold frame, rocket/sleeping-girl icon,
   play/pause badge and copy, so this is a bare hit target around it rather than a
   styled button: no border, background, padding or box-shadow, all of which would
   draw a second frame around a picture that already has one.

   The two files differ slightly in aspect (6.46:1 vs 5.95:1), so height is left to
   the image instead of pinned here — the states never appear together, so the few
   pixels of difference between them is never visible as a jump.

   Press/hover feedback is kept deliberately: with the label inside the image there
   is nothing else to signal that this is a control at all. */
.robot-art-button {
    width: 100%;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    cursor: pointer;
    line-height: 0;
    transition-duration: .2s;
    /* Same reason as .manage-button: mobile Safari/Chrome paint native control
       chrome over a <button> unless this is turned off, which on a transparent
       PNG shows up as a grey plate behind the artwork. */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.robot-art-button img {
    width: 100%;
    height: auto;
    display: block;
    /* The art is transparent around its rounded frame, so the shadow has to follow
       the alpha channel rather than the element's box. */
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .3));
}

.robot-art-button:hover img {
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .3)) brightness(1.07);
}

.robot-art-button:active {
    transform: scale(.96);
    transition-duration: .2s;
}

/* No subscription on this post: the same artwork stays in the slot so the row
   doesn't change shape, drained of colour to read as unavailable. The title
   attribute carries the actual reason. */
.robot-art-button:disabled {
    cursor: default;
}

.robot-art-button:disabled img {
    filter: grayscale(.85) opacity(.55);
}

.robot-art-button:disabled:active {
    transform: none;
}

/* KingCalibre referral promo, directly under the manage-post button grid. The
   artwork (kingcalibre-promo-banner.png, 1536x1024) already carries its own
   full design — crown, gift, money bag, WhatsApp CTA bar, all four feature
   callouts — so this is just a sized/rounded frame for the image plus the
   dismiss control layered on top of it, not a card built out of independent
   text/icon rules.

   Capped at 420px and centered, not full width of #threebuttoncontainer
   anymore: shrinking it whole (width and height together, via this cap) is
   what keeps the 1.85:1 crop below intact with nothing further cut off —
   cropping the strip shorter instead would have started eating into the
   WhatsApp bar. Hidden from JS by Views/Post/Index.cshtml once dismissed —
   there's no CSS "dismissed" state. */
.promo-banner {
    position: relative;
    margin: 18px auto 0;
    width: 100%;
    max-width: 420px;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(170, 31, 84, .18);
    line-height: 0;
    /* Pops in as the page paints, then ripples an orange halo twice — a
       notification-style bump, not a persistent distraction, so it reads as
       "new" without nagging on a page a client may leave open for hours.
       "both" keeps the pre-0% state (scaled down, transparent) applied before
       the animation starts, so there's no flash of the full-size card before
       it begins shrinking in. */
    animation: promo-banner-pop .45s cubic-bezier(.34, 1.56, .64, 1) both,
               promo-banner-glow 1.4s ease-out .45s 2;
}

@keyframes promo-banner-pop {
    0% { transform: scale(.82); opacity: 0; }
    60% { transform: scale(1.035); opacity: 1; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes promo-banner-glow {
    0%, 100% { box-shadow: 0 4px 16px rgba(170, 31, 84, .18), 0 0 0 0 rgba(244, 144, 30, .55); }
    50% { box-shadow: 0 4px 16px rgba(170, 31, 84, .18), 0 0 0 9px rgba(244, 144, 30, 0); }
}

/* Users who've asked the OS/browser to cut motion get the card at full size and
   opacity immediately instead — no scale-in, no ripple. */
@media (prefers-reduced-motion: reduce) {
    .promo-banner {
        animation: none;
    }
}

/* Cropped to a thin, wide strip — object-position:top keeps the crop entirely
   off the bottom. The ratio was picked by rendering candidate crops (780px/
   830px/880px of the 1024px-tall source) and comparing them directly rather
   than guessing: 830px is the tallest crop that still fully clears the
   WhatsApp CTA bar's rounded bottom border with a little margin, without the
   feature-icon row underneath (Promociona/Atrae/Haz Crecer/Gana Premios)
   starting to peek in — 880px let that row's icons bleed in half-cut, which
   read as broken rather than intentionally cropped. 1536/830 ≈ 1.85:1 keeps
   the crown, title, "más visibilidad" pill, ribbon, gift box, money bag, and
   the WhatsApp bar (phone number + "Mensajéame" button) all fully visible;
   only that icon row and the "Únete a KingCalibre" footer band underneath —
   a secondary recap of the same pitch — are cropped out. */
.promo-banner-img {
    display: block;
    width: 100%;
    aspect-ratio: 1.85 / 1;
    object-fit: cover;
    object-position: top;
}

/* Circular chip rather than a bare × like the other on-page popups use — those
   sit on a solid-color header band this card no longer has, so a plain
   character with no backdrop would land on whatever the artwork happens to
   paint at that corner (light, dark, or mid-tone) with no guaranteed contrast.
   A translucent white disc guarantees the pink × reads against any of it. */
.promo-banner-dismiss {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .85);
    color: #aa1f54;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

.promo-banner-dismiss:hover,
.promo-banner-dismiss:active {
    background: #ffffff;
}

@media screen and (max-width: 600px) {
    .promo-banner {
        width: 92vw;
        border-radius: 5vw;
    }
    .promo-banner-dismiss {
        top: 2vw;
        right: 2vw;
        width: 7.5vw;
        height: 7.5vw;
        font-size: 5vw;
    }
}

/* Outer layer of the .post_title/.post_title_caption look: a muted-tan bordered
   box wrapping the white, pink-bordered .bump-timer below, same as .post_title
   wraps .post_title_caption. */
.bump-timer-wrap {
    padding: 4px;
    border: 3px solid #d2c4bd;
    margin: 0 auto 12px;
    width: 95%;
    max-width: 500px;
    border-radius: 18px;
    background-color: #faf4d8;
    box-sizing: border-box;
}

/* Inner layer — same card treatment as .post_title_caption (white, pink border,
   rounded) so the countdown reads as part of this page's own design rather than a
   bolted-on pill — just bigger, since it's the one thing here worth glancing at
   repeatedly. */
.bump-timer {
    font-family: 'Segoe UI', system-ui, sans-serif;
    text-align: center;
    background: #ffffff;
    border: 3px solid #ff86c7;
    border-radius: 14px;
    padding: 10px 18px;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .15);
    white-space: nowrap;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    width: 100%;
    box-sizing: border-box;
}

.bump-timer-label {
    color: #aa1f54;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .2px;
}

.bump-timer strong {
    color: black;
    font-size: 26px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    letter-spacing: .5px;
}

.bump-timer-muted {
    color: #5a6472;
}

/* Second line inside .bump-timer-wrap, under the countdown: what the next bump is
   going to carry, when the client has an edit in flight (Views/Post/Index.cshtml).
   A sibling of .bump-timer rather than a child of it — that box is white-space:
   nowrap for the mm:ss readout, and this is a sentence that has to wrap. */
.bump-timer-note {
    font-family: 'Segoe UI', system-ui, sans-serif;
    margin-top: 4px;
    padding: 6px 10px;
    border-radius: 12px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
    box-sizing: border-box;
}

.bump-timer-note strong {
    font-weight: 800;
}

/* Cleared every gate — the countdown is counting down to this going live. */
.bump-timer-note--ready {
    background: #e7f7ec;
    border: 2px solid #4bbd74;
    color: #1d6b3c;
}

/* Submitted but held: by the client's own confirmation, or by an admin. Amber
   rather than the green above, because the countdown on screen will come and go
   without publishing anything. */
.bump-timer-note--waiting {
    background: #fff5da;
    border: 2px solid #e5b33a;
    color: #7a5200;
}

@media screen and (max-width: 600px) {
    .bump-timer-note {
        font-size: 3.2vw;
        padding: 1.6vw 2.4vw;
        border-width: 1.5px;
        border-radius: 3vw;
    }
}

@media screen and (max-width: 600px) {
    /* .robot-control-cell keeps its base width:92% here — 92vw would now be wider
       than .managebutton_wrapper itself (calc(100% - 24px) at every width since the
       mobile override was dropped), pushing the Pausar/Empezar cell past the row the
       other four buttons sit in. */
    .bump-timer-wrap {
        width: 95vw;
        border-width: 2px;
        border-radius: 5vw;
    }
    .bump-timer {
        padding: 3vw 4vw;
        border-width: 2px;
        border-radius: 4vw;
        gap: 1vw;
    }
    .bump-timer-label {
        font-size: 3.6vw;
    }
    .bump-timer strong {
        font-size: 6.5vw;
    }
}

/* Shown in the same slot .bump-timer-wrap occupies when the bot exists and is
   paused, but edge-to-edge rather than inset/capped like that card — a light
   full-width wash rather than another boxed pill. */
.pause-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 0 12px;
    width: 100%;
    padding: 4px 10px;
    background: rgba(255, 193, 7, .15);
    border: 2px solid #ffe08a;
    border-radius: 10px;
    color: #664d03;
    font-weight: 700;
    font-size: 16px;
    text-align: center;
    box-sizing: border-box;
}

@media screen and (max-width: 600px) {
    .pause-banner {
        border-width: 1.5px;
        border-radius: 2vw;
        font-size: 4vw;
        padding: 1.2vw 3vw;
    }
}

.manage-button {
    /* border-box, not the default content-box: at this width the button's own 2px
       border plus (on .small.manage-list-font) padding used to add on top of that
       percentage instead of eating into it, so two buttons already summed past the
       row's real width and every one of them wrapped onto its own line instead of
       the intended 2-per-row grid. */
    box-sizing: border-box;
    /* Exactly half the row minus half the wrapper's own 10px gap, so two of these
       fill the row edge-to-edge (was 44%, leaving a wide gutter down the middle) —
       the extra width is what gives "Remove Post"/"Bump to Top" enough room to sit
       on one line instead of wrapping. */
    width: calc(50% - 5px);
    height: 115px;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: white!important;
    text-decoration: none!important;
    cursor: pointer;
    border-radius: 24px;
    text-shadow: 2px 4px 6px #7a7a7ab3, 0 0 3px #ffffff, 1px 4px 6px #12121214;
    border: 2px solid #2e2e2e;
    box-shadow: inset -2px -2px 5px 0px #262626;
    transition-duration: .2s;
    /* These are real <button> elements, and mobile Safari/Chrome paint their own
       native "control" chrome on top of a button's background by default — a
       glossy highlight baked into the OS widget, not anything in this stylesheet
       — unless appearance is explicitly turned off. Desktop browsers are far less
       aggressive about it, which is why the exact same CSS below (including the
       hard 5px highlight stop on .button-red etc.) reads as an extra white sheen
       on phones that desktop never shows. */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.manage-button.small {
    min-height: 56px;
    height: auto;
    background-size: 100% 100%;
    border-radius: 17px;
    align-self: end;
}
.manage-button:active {
    box-shadow: none;
    transform: scale(.93);
    transition-duration: .2s;
}
.manage-button:hover {
    filter: brightness(1.09);
    transition-duration: .2s;
}

.manage-list-font {
    font-family: Arial;
    font-weight: 900;
    line-height: 1.05;
    font-size: 30px;
    text-transform: uppercase;
    letter-spacing: -0.2rem;
    /* Was a soft 0 0 4px shadow plus -webkit-text-stroke:1px for a bold outline
       look. Samsung Internet (and some other Android WebViews) render that stroke
       as a visible rectangular box/frame around each glyph instead of a clean
       outline — a real engine bug, not anything tunable in this stylesheet — so
       the outline is rebuilt here from four offset hard shadows instead, which
       every browser renders as solid fill, no glyph-level stroke involved. The
       soft 0 0 4px shadow stays layered on top for the same glow the stroke used
       to add. */
    text-shadow: -1px -1px 0 black, 1px -1px 0 black, -1px 1px 0 black, 1px 1px 0 black, 0 0 4px black;
}

.manage-button.small.manage-list-font {
    /* Scales down with the viewport instead of a flat 23px (still the cap, so
       desktop is unchanged) — the button's own width is viewport-relative too,
       so at narrow widths the text needs to shrink along with it to keep
       white-space:nowrap below from ever overflowing the button. */
    font-size: clamp(14px, 4.8vw, 23px);
    line-height: 1.05;
    padding: 9px 6px;
    text-align: center;
    /* .manage-list-font's letter-spacing is a fixed -0.2rem (≈ -3.2px), tuned for
       that class's flat 30px size — already tight there, and this button's own
       font-size shrinks further on narrow screens (down to 14px via the clamp
       above), which turned that same fixed squeeze into visibly overlapping
       letters. Overridden here with a much lighter em value (scales with
       font-size instead of staying fixed) — just enough uppercase tracking to
       read as intentional, not tight enough to crowd letters together. */
    letter-spacing: -0.02em;
    /* "Remove Post"/"Bump to Top" must read as one line, not wrap onto a
       second — the wider .manage-button (see above) plus the font-size clamp
       are what make that fit instead of overflowing. */
    white-space: nowrap;
}

.manage-list-font span {
    font-size: 24px;
    margin-top: 8px;
}
/* The vw-based mobile overrides that used to live here (font-size 5.5vw/4.6vw,
   min-height 14vw, width 44vw, border-radius 11px) are gone on purpose: they made the
   manage buttons read as a different, more cramped design on phones than on desktop.
   The base rules above now apply at every width, so type size, min-height, padding and
   corner radius match; only the buttons' own width:44% still tracks the viewport. */

.manage-button:hover,
.manage-button:active {
    color: white!important;
}

/* Hard color stop (light, then an instant switch to the base color) instead of a
   soft 1%-to-11% blend. A blended transition needs enough actual pixels to render
   smoothly — back when these buttons shrank on mobile (a ~14vw min-height instead
   of today's flat 60px) the same blend that looked like a thin highlight on desktop
   didn't have room to resolve there and anti-aliased into an overall lighter/
   washed-out tone. A hard stop has no blend zone to under-resolve, so it renders
   the same crisp strip at any size.

   The stop is 5px, not the 8% it used to be. A percentage stop is a share of the
   button's own height, so it only looked like a thin highlight on a 60px button:
   whenever a label wrapped to two lines the box grew and the pale band grew with
   it, washing out the top of the text sitting under it. That happens far more on
   narrow screens, where "REMOVE POST"/"BUMP TO TOP" wrap and their neighbours
   don't — which is why the same button read brighter, with a white cast over the
   top, on a phone than on desktop. A fixed 5px (what 8% of the 60px minimum came
   out to) keeps the band identical whatever height the label forces. */
.button-red {
    background: linear-gradient(#ffb0c7 0px, #ffb0c7 5px, #df3e6d 5px);
}

.button-green {
    background: linear-gradient(#ffb0c7 0px, #ffb0c7 5px, #df3e6d 5px);
}

.button-blue {
    background: linear-gradient(#d9e1ff 0px, #d9e1ff 5px, #2755f0 5px);
}

.button-blue-light {
    background: linear-gradient(#eff5ff 0px, #eff5ff 5px, #5b9dff 5px);
}

.button-orange {
    background: linear-gradient(#ffe1d4 0px, #ffe1d4 5px, #df5e29 5px);
}

.button-purple {
    background: linear-gradient(#e6d9ff 0px, #e6d9ff 5px, #7c3fe0 5px);
}

.button-yellow {
    background: linear-gradient(#fff3b0 0px, #fff3b0 5px, #e0b800 5px);
}

.button-yellow,
.button-yellow:hover,
.button-yellow:active {
    color: #fff !important;
}

.manage-button:disabled {
    opacity: .5;
    cursor: not-allowed;
    filter: none;
}

.manage-button:disabled:active {
    transform: none;
    box-shadow: inset -2px -2px 5px 0px #262626;
}

.button-red-long {
    background-image: url('/resources/img/button_red_long.png');
}

.button-blue-long {
    background-image: url('/resources/img/button_blue_long.png');
}

.font-decoration-green {
    text-shadow: 5px 0 3px #037100, -5px 0 3px #037100, 0 5px 3px #037100, 0 -4px 3px #037100;
}

.font-decoration-blue {
    text-shadow: 5px 0 3px #025970, -5px 0 3px #025970, 0 5px 3px #025970, 0 -4px 3px #025970;
}

.font-decoration-red {
    text-shadow: 5px 0 3px #8d1041, -5px 0 3px #8d1041, 0 5px 3px #8d1041, 0 -4px 3px #8d1041;
}

.font-decoration-purple {
    text-shadow: 5px 0 3px purple, -5px 0 3px purple, 0 5px 3px purple, 0 -4px 3px purple;
}

.font-decoration-green-little {
    text-shadow: 3px 0 3px #037100, -3px 0 3px #037100, 0 3px 3px #037100, 0 -3px 3px #037100;
}

.font-decoration-blue-little {
    text-shadow: 3px 0 3px #025970, -3px 0 3px #025970, 0 3px 3px #025970, 0 -3px 3px #025970;
}

.font-decoration-red-little {
    text-shadow: 3px 0 3px #8d1041, -3px 0 3px #8d1041, 0 3px 3px #8d1041, 0 -3px 3px #8d1041;
}

.font-decoration-purple-little {
    text-shadow: 3px 0 3px purple, -3px 0 3px purple, 0 3px 3px purple, 0 -3px 3px purple;
}

.list-post {
    margin: 16px 18px 0 18px;
}

.list-post hr {
    width: 100%;
    border-top: 2px solid #cfbd9e;
}

.list-post-title {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #c71356!important;
    background-color: #fbf9e7;
    padding: 8px;
    font-size: 16px;
    font-weight: 900;
    border: 2px solid #eb6bfb;
    border-radius: 8px;
    width: 100%;
    margin: auto;
}
.list-post-title-link:hover {
    text-decoration: none;
}

.list-post-body__details {
    display: flex;
    justify-content: start;
    margin-top: 16px;
    margin-left: 8px;
    gap: 8px;
}
.list-post-body__details > div:nth-child(1) {
    width: 70%;
}
.list-post-body__details > div:nth-child(2) {
    width: 30%;
}
.post-details__header,
.post-details__value {
    font-size: 14px;
    font-weight: bold;
}
.post-details__header {
    color: #c20606;
}
.post-details__value {
    color: black;
}
table .post-details__value {
    padding-left: 8px;
}

.list-post-body__container {
    display: flex;
    /* gap: 16px; */
    margin-top: 16px;
    margin-left: 6px;
}
.list-post-body .list-post-body__image {
    position: relative;
    width: 40%;
}
.list-post-body .list-post-body__image img {
    width: 100%;
    max-height: 134px;
    object-fit: cover;
    object-position: center;
    position: relative;
    z-index: 1;
}
.list-post-body__image .list-post-title-link:after {
    content: '';
    position: absolute;
    top: 6px;
    left: 6px;
    background-color: #d6d6d6;
    width: 100%;
    height: 100%;
    border-radius: 3px;
}
.image-shadow-border {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    background-color: transparent;
    width: calc(100% + 6px);
    height: calc(100% + 6px);
    border-radius: 6px;
    border: 1px solid #d6d6d6;
}
.list-post-body .list-post-body__text {
    width: 60%;
    height: 100%;
    max-height: 124px;
    overflow: hidden;
    position: relative;
    flex-grow: 1;
    overflow: hidden;
    white-space: pre-line;
    color: #4a1607;
    font-size: 14px;
    margin-left: 16px;
}
.list-post-body .list-post-body__text:before {
    content: '';
    position: absolute;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 124px;
    background: linear-gradient(to top, #fdf6fb 0%, #fdf6fb00 60%);
}
.list-post-body .post-details {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
}
.list-post-body .post-published {
    text-align: center;
    padding: 4px 0;
    border-radius: 12px;
    width: 100%;
    max-width: 540px;
    margin: 16px auto 4px;
    font-size: 14px;
    border: 1px solid gray;
}
.list-post-body .post-content {
    position: relative;
    flex-grow: 1;
    overflow: hidden;
    white-space: pre-line;
    padding: 8px 32px;
    color: #4a1607;
    font-size: 20px;
    text-align: center;
    line-height: 40px;
}

.list-post-body .post-published > span:nth-child(1) {
    color: #562415;
}
.list-post-body .post-published > span:nth-child(2) {
    color: #f23c7e;
}

#manage_top_block {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: auto;
    margin-top: 16px;
    margin-bottom: 24px;
}
#manage_top_block > div {
    width: 97%;
    padding: 4px 0;
    border: 1px solid #1e1e1e;
    margin: 6px 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius: 10px;
    font-style: italic;
    font-size: 19px;
}
@media screen and (min-width: 360px) and (max-width: 446px) {
    #manage_top_block > div {
        font-size: 14px;
    }
}
@media screen and (max-width: 359px) {
    #manage_top_block > div {
        font-size: 12px;
    }
}
#manage_top_block > div > span:nth-child(1) {
    color: #55122c;
}
#manage_top_block > div > span:nth-child(2) {
    color: #ee2f77;
}

.horizontal-divider {
    width: 100%;
}

.post_preview_media {
    margin: 8px;
    text-align: center;
}
.report-bug {
    text-align: center;
}
.account-options {
    display: flex;
    justify-content: space-around;
}
.report-bug > a {
    display: inline-block;
    height: 58px;
    font-size: 18px;
    text-transform: uppercase;
    color: black;
    font-weight: 900;
    padding: 14px 10px;
    border-radius: 14px;
    background-color: #dfcdd3;
}
.delete-account {
    cursor: pointer;
}
.delete-account > a {
    display: inline-block;
    height: 58px;
    font-size: 18px;
    text-transform: uppercase;
    color: white;
    font-weight: 900;
    padding: 14px 10px;
    border-radius: 14px;
    background-color: black;
}
@media screen and (max-width: 500px) {
    .delete-account > a, .report-bug > a {
        font-size: 3vw;
    }
}
.delete-account > a > img {
    max-width: 30px;
}
.report-bug > a:hover,
.btn-delete-account {
    color: white!important;
    background-color: #c752b3;
    border-color: #7d2076;
}
.btn-delete-account:hover {
    background-color: #d179c2;
}
.delete-account > a:hover {
    text-decoration: none;
}
.report-bug > a > img {
    width: 20px;
}
.screaming-girl {
    text-align: center;
}
.screaming-girl img {
    max-width: 200px;
}
/*manage post end*/

.timer {
	color:rgb(253,52,171);
	font-size: 3em;
	text-align: center;
}

/* Candy Skin */
.candy {
    height: 100%;
}

.candy body {
    padding-top: 0;
    height: 100%;
}

.candywrapper {
    background: #fd34ab; /* Old browsers */
    background: -moz-linear-gradient(top, #fd34ab 0%, #ffffff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fd34ab 0%, #ffffff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fd34ab 0%, #ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fd34ab', endColorstr='#ffffff', GradientType=0); /* IE6-9 */
    min-height: 100vh; /* 100%; */
    position: relative;
    padding: 1.5em 0;
}

.candypreview {
    position: relative;
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0;
}

.candy_header {
    position: absolute;
    width: 50%;
    right: 17px;
    top: 18px;
    z-index: 0;
}

.supporttcasewrapper {
    background: #143744 ; /* Old browsers */
    background: -moz-linear-gradient(top, #143744  0%, #ffffff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #143744  0%, #ffffff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #143744  0%, #ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#143744 ', endColorstr='#ffffff', GradientType=0); /* IE6-9 */
    min-height: 100%;
    position: relative;
    padding: 1.5em 0;
}

.writepost_devilgirl {
    width: 65%;
    clear: both;
    float: left;
    display: block;
}

.preview_devilgirl {
    margin-bottom: -35px;
}

.form_element {
    margin: 0 1em 3px 1em;
}

.form_element::after {
    content: "";
    display: block;
    clear: both;
}

.form_element .form_label {
    font-family: 'Helvetica';
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 1px;
    -webkit-background-clip: text;
    color: #f8d007e8;
    filter: drop-shadow(0px 0px 4px #4b0c0c);
    text-shadow: 0px 0px 3px #4b0c0c, 0px 0px 5px #4b0c0c, 0px 0px 7px #4b0c0c;
    position: relative;
    margin-top: 4px;
    margin-bottom: 0;
    padding-left: 4px;
}

.form_element .form_label::before {
    content: attr(data-text);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    text-shadow: inset 0px 0px 4px brown;
    pointer-events: none;
}

.form_element.addphotoheading .form_label.candy_label {
    margin-bottom: 18px;
    padding-top: 2px;
    margin-left: 2px;
}

.form_element.addvideoheading .form_label.candy_label {
    margin-bottom: 8px;
    margin-top: 6px;
    margin-left: 2px;
}

.form-control--disabled {
    pointer-events: none;
    background-color: #f5f5f5;
    color: #a9a9a9;
    border: 1px solid #ddd;
    opacity: 0.6;
}

.addvideoheading_label {
    color: #b86f9d;
    font-size: 13px;
    font-family: 'Verdana', sans-serif;
}

#second_form_page .form_element {
    margin-bottom: 0em;
}

.form_element > div > #body + .emojionearea > .emojionearea-editor {
    max-height: 13.8em !important;
    white-space: pre;
    overflow-x: hidden;
}

.form_element > div > #body {
    white-space: pre;
    overflow-x: hidden;
}

.addphotoheading, .addvideoheading {
    padding: 4px;
}

.imageDeleteEmpty {
    clear: both;
    height: 21px;
    max-width: 1px;
    margin: auto;
}

.imageUploadButton {
    visibility: hidden;
}

.videodelete {
    clear: both;
    color: #feffa6;
    max-width: 80%;
    margin: auto;
}

progress {
  background-color: #feffa6;
  -webkit-appearance: none;
  -moz-appearance: none;
}

::-webkit-progress-bar {
  background-color: #feffa6;
}
::-moz-progress-bar {
  background-color: #feffa6;
}

.text-gray {
    color: #a8a7a8;
}

.candy label[for="is_mail_checkbox"], .candy label[for="is_phone_checkbox"] {
    color: #FD51B7;
    margin-left: 0.7em;
}

.candy label[for="is_phone_checkbox"] {
    display: none;
}

.mediabutton {
    background: #fff;
    border: 2px solid #fc6621;
}

input#is_mail_checkbox, input#is_phone_checkbox {
    float: left;
    position: relative;
    display: inline-block;
    margin: 4px;
}

.changephonelink {
    display: inline-block;
    margin-left: 8px;
}

#prevpostnow {
    color: #c1f6eb;
    cursor: pointer;
}

.phone-dialog .ui-dialog-titlebar {
    display: none;
}
.phone-dialog .ui-dialog-buttonpane {
    margin-top: 0;
    padding-bottom: 4px!important;
}
.phone-dialog #warning-message-dlg {
    padding-bottom: 2px;
}
.phone-dialog .ui-dialog-buttonset button {
    background-color: #bb6498!important;
    border-radius: 8px;
    padding: 4px 12px;
}

/*borders*/
.topborder {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 10px;
    background: url('../img/topborder.png') repeat-x;
    display: block;
    background-size: auto 100%;
    background-position-x: 19px;
}

.leftborder {
    position: absolute;
    top: 10px;
    left: 0;
    width: 10px;
    height: calc(100% - 15px);
    background: url('../img/leftborder.png') repeat-y;
    background-size: 100% auto;
    display: block;
}

.rightborder {
    position: absolute;
    top: 10px;
    right:0;
    width:10px;
    height: 1180px;
    background: url('../img/rightborder.png') repeat-y;
    background-size: 100% auto;
    display:block;
    background-position: top right;
    margin-left: 965px;
}

.bottomborder {
    position: relative;
    bottom: 59px;
    left: 0;
    width: 44%;
    height: 9px;
    background: url('../img/bottomborder.png') repeat-x;
    background-size: auto 100%;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#firstStage:before {
    content: "";
    position: absolute;
    left: 0;
    width: 10px;
    background: url('../img/rightborder.png') repeat-y;
    background-size: 100% auto;
    display: block;
    margin-left: 590px;
    top: 10px;
}

.text-uppercase {
    text-transform: uppercase;
}

.phonetext_field {
    padding: 0 0 0 1em;
}

.isee_field {

}

.addphotoheading {
    margin: 20px 0 -7px 2px;
}

.addvideoheading {
    margin: 20px 0 12px 2px;
}

#user_validation_by_phone_is_not_available .modal-dialog,
#preview .modal-dialog,
#incorrectPinCode .modal-dialog {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 90%;
    transform: translate(-50%, -50%);
    max-width: 350px;
    margin: 0 auto;
}

#preview .modal-dialog {
    left: 0!important;
}

/* New login page */
html.loginpage {
    height: 100%;
}

.loginpage body {
    background: #fff;
    padding-top: 0;
    min-height: 100%;
    height: 100%;
}

.loginpage .container {
    background: #fff;
    padding: 1em 0;
    min-height: 100%;
    margin-bottom: 0;
}

.loginpage main {
    min-height: 100vh;
}

.loginpage .container.login-page {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 28px;
    justify-content: center;
    padding: 16px;
}

.access-login-logo {
    max-width: 560px;
    width: min(96vw, 560px);
}

h3.logincopy,
h2.logincopy {
    color: #b7a690;
    font-size: 18px;
    letter-spacing: 0.2px;
}

a.starthere {
    display: block;
    width: 90%;
    color: #fff;
    background-color: #0492ff;
    margin: auto;
    font-size: 25px;
    line-height: 30px;
    padding: 3px;
    letter-spacing: 1px;
    border-radius: 3px;
    text-decoration: none;
    font-weight: bold;
    max-width: 245px;
}

a.starthere:hover {
    text-decoration: none;
}

a.starthere:visited {
    color: #fff;
}

#login_data_form, .forgotpass_form, #sign_up_data_form, #contact_us_form, #reply_post_separate_form, #person_phone_form_to_check {
    background: #fdfeb5;
    padding: 10px;
    border: 2px solid #fde45b;
    border-radius: 25px;
    width: 90%;
    margin: auto;
}

#login_data_form {
    background: transparent;
    border: 0;
    padding: 0;
    width: 100%;
}

.contact_massage {
    font-size: 2.2rem;
    width: 80%;
    text-align: justify;
    color: #595858;
    margin: 45px auto 0;
}
.contact_massage img {
    width: 100%;
}

#login_data_submit_button, #sign_up_data_submit_button, #reset_password_submit_button, #enter_new_password_submit_button, #id_select_city_submit {
    display: block;
    margin: auto auto 10px auto;
    width: 110px;
    height: 45px;
    border: 0;
    background: #feb161;
    color: #fff;
    font-size: 20px;
    letter-spacing: 1px;
    font-weight: normal;
}

#login_data_submit_button,
#reset_password_submit_button,
#sign_up_data_submit_button {
    text-transform: uppercase;
    font-weight: bold;
    width: 120px;
}

.loginlabel {
    margin-top: 7px;
    font-size: 25px;
    font-weight: 500;
    color: #B7A690;
}

#person_username_field_login,
#person_password_field_login,
#person_username_field_signup,
#person_password_field_signup,
#person_phone_field_to_check,
#email_field_password_reset,
#email_contact_us_field,
#subject_contact_us_field,
#message_contact_us_field,
#captcha_code,
#person_email_field_signup,
#person_confirmPassword_field_signup {
    width: 90%;
    margin: 0.5em auto;
    font-size: 14px;
    border-radius: 3px;
}

.loginwrapper {
    max-width: 400px;
    margin: auto;
}

.access-login-form {
    width: 100%;
}

.access-login-input {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.access-login-input .form-control {
    text-align: center;
}

.access-login-help {
    margin-top: 36px;
    margin-bottom: 30px;
}

.login-help-copy {
    color: #6f6f6f;
    font-size: 14px;
    line-height: 1.45;
    margin: 10px auto 0;
    max-width: 260px;
}

.passreset {
    color: #0492ff;
    display: inline-block;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 6px;
    text-decoration: none;
    text-transform: uppercase;
}

.access-back-link {
    text-align: center;
}

.form-wrapper {
    max-width: 270px;
    margin: auto;
}

/* styled error message */

.stylederror {
    background: radial-gradient(circle at center, #ffeb0026 30%, #fff7004f 70%);
    border: 2px solid #ff8100;
    border-radius: 5px;
    padding: 1em;
    color: #000000d4;
}

@media screen and (max-width: 600px) {
    .stylederror h2 {
        font-size: 5vw;
    }
}

.stylederror p {
    margin-bottom: 24px;
    white-space: pre-wrap;
}

/* styled success message */
.styledsuccess {
    background: #dfffd3;
    border: 2px solid #2c9d00;
    border-radius: 5px;
    padding: 1em;
    color: #2c9d00;
}

.agechecker {
    width: 90%;
    margin: 1em auto;
}

.privacy p, .privacy ol, .privacy li {
    text-align: justify !important;
}

.termsLinksPage p, .termsLinksPage .privacy ol, .termsLinksPage .privacy li {
    margin-bottom: 8px;
    text-align: center !important;
    font-size: 1.125em;
}

.privacy blockquote {
    font-size: 12px;
}

#bottom_button_container_back_from_brief, #bottom_button_container_back_to_list {
    display: inline-block;
}

/*Searching the internet*/

#searching_the_internet {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #fff;
    z-index: 1000;
    display: none;
}

.phoneverify {
    width: 300px;
    margin: 2em auto;

}

#threebuttoncontainer, #threebuttoncontainer_new {
    display: block;
}

#threebuttoncontainer, #threebuttoncontainer_new, #footercontainer {
    background-color: #fdf6fb;
}

.searching_text {
    text-align: center;
    display: block;
    font-size: 21px;
    margin: 1em auto;
}

img.searchgif {
    clear: both;
    display: block;
    margin: auto;
    width: 180px;
}

.searchcenter {
    width: 310px;
    height: 210px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    padding: 1em;

}
/* Manage post modal window */

.container-wrapper {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 85%;
    z-index: 2001;
}

.important-message-container {
    display: none;
    position: relative;
    flex-direction: column;
    justify-content: space-between;
    width: 380px;
    margin: auto;
    font-family: Arial, Helvetica;
    border-radius: 8px;
    background-color: white;
    box-shadow: 0px 7px 14px 3px #afafaf;
}

@media screen and (max-width: 400px) {
    .important-message-container {
        width: 280px;
        font-size: 10px;
    }
    .important-message-container .body>div {
        line-height: normal;
        margin: 0;
    }
}

.important-message-container .title {
    color: white;
    background-color: #9ca6af;
    text-transform: uppercase;
    text-align: center;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    padding: 3px 0;
}

.important-message-container .body {
    padding: 10px;
    max-height: 80vh;
    overflow: auto;
}
.important-message-container .body>div {
    line-height: 21px;
    margin: 5px 0;
}
.important-message-container .body .red {
    color: red;
}

.important-message-container .button {
    align-self: center;
    bottom: 0;
    color: white;
    background-color: #0095ff;
    border-radius: 5px;
    padding: 4px;
    margin: 10px 0;
    box-shadow: 0px 4px 6px 0px #afafaf;
    cursor: pointer;
}

.important-message-container .button:active {
    box-shadow: none;
    transform: translateY(3px);
}

/* Buy panel */

#buy_panel {
    height: calc(100% + 50px);
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background: red;
    z-index: 2000;
    margin-bottom: -50px;
    display: none;

}

.candy h4.gray::after {
    content: '';
    display: block;
    clear: both;
}

/* success page */

html.successpage {
    min-height: 100%;

    background: #bdeefe; /* Old browsers */
    background: -moz-linear-gradient(top, #bdeefe 0%, #ffffff 45%, #ffffff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #bdeefe 0%, #ffffff 45%, #ffffff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #bdeefe 0%, #ffffff 45%, #ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bdeefe', endColorstr='#ffffff', GradientType=0); /* IE6-9 */

}

.successpage body {
    background: none;
    min-height: 100%;
    height: 100%;
}

.successpage body {
    padding-top: 1em;
}

#viewpost_button, #editpost_button {
    display: inline-block;
    text-align: center;
    width: 199px;
    height: 63px;
    margin: 0 4px;
}

#successcake {
    max-width: 80%;
    margin: -1.5em auto;
}

#viewpost_button:hover, #editpost_button:hover {
    text-decoration: none;
}

#viewpost_button {
    background: url('../img/button_viewpost.png') no-repeat;
    background-size: 100% 100%;
}

#editpost_button {
    background: url('../img/button_editpost.png') no-repeat;
    background-size: 100% 100%;
}

.videocomingsoon {
    display: block;
    margin: 0;
    clear: both;
    width: 95%;
}

#firstStage, #secondStage {
    margin-top: -15px;
}

.city-wrapper {
    margin-right: 4px;
}

/* Media Queries */

/* Start below 550 */
@media screen and (max-width: 550px) {
    .prodectList_heaser_info {
        font-size: 21px;
        margin-top: 100px;
    }


}

/* End below 550 */

/* start above 480 -- Desktop */

@media screen and (min-width: 481px) {
    .mediabutton {
        margin-left: 6px;
    }

    .phoneselector {
        width: 50%;
        float: left;
    }

    .changephonelink {
        line-height: 2em;
    }

    p.success {
        font-size: 20px;
    }

    .betatag {
        width: 78px;
        height: 50px;
        left: 7%;
        top: 10%;
    }

    .profiledit .betatag, .brief .betatag, .gallery .betatag {
        left: auto;
        top: 16px;
        right: 48%;
    }

    .singlepost .betatag {
        left: 32%;
        top: 22px;
    }

    .managepostpage .betatag {
        top: 29px;
        right: 249px;
        left: auto;
        width: 65px;
        height: 37px;
        z-index: 9000;
    }

    .candy .betatag {
        top: 41px;
        right: 269px;
        left: auto;
        width: 65px;
        height: 37px;
        z-index: 9000;
    }

    .successpage .betatag {
        top: 20px;
        left: 120px;
    }

}

.table-agree-to-terms tr td img {
    width: 90%;
    position: relative;
    top: -5px;
}

/*end above 480 */


@media screen and (min-width: 992px) and (max-width: 1010px) {
    .phonetext_field {
        margin-right: -11.5%;
    }
}

/* start below 480 -- mobile iphone 6 */
@media screen and (max-width: 560px) {
    .phonetext_field {
        float: left;
        margin-top: 4px;
        width: 100% !important;
        padding-left: 0;
    }

    .zeroSidePadding {
        width: 100%;
    }

    .table-agree-to-terms tr td img {
        width: auto;
        height: 22px;
    }

    .prodectList_heaser_info{
        margin-top: 90px;
        font-size: 20px;
    }
    .card_info_wrapper {
        width: 100%;
    }

}

@media screen and (max-width: 480px) {
    .meetnow_byline {
        font-size: 13px;
    }

    .candywrapper {
        margin-bottom: 0;
    }

    .mediabutton {
        margin-left: 3px;
    }

    .preview_byline {
        font-size: 17px;
        line-height: 19px;
        bottom: 19px;
        right: 31px;
    }

    .preview_devilgirl {
        margin-bottom: -29px;
    }

    .brown_editpost {
        width: 80px;
        height: 40px;
        top: 58px;
    }

    video {
        max-width: 100%;
        width: 100%;
    }

    .devilgirl_hookups {
        width: 32%;
        top: 8px;
        left: 4px;
    }

    .list_city .mpcityname, .list_city .changeCityLink {
        font-size: 12px;
    }

    a.navtext {
        font-size: 8pt;
    }

    .view_buttons_container {
        margin-top: 5px;
        margin-left: 36%;
    }

    .gallerylistad {
        width: 100%;
    }

    .fp_buttons {
        padding-top: 2em;
    }

    .changeCityLink {
        font-size: 10px;
    }

    .mpcityname {
        font-size: 10pt;
    }

    #hookup_an_ad_image {
        width: 86%;
        margin-left: 12px;
    }

    .picLabel {
        font-size: 2.5em;
        top: 40%;
    }

    #manageTopText {
        padding: 0 27px 0;
        font-size: 11px;
        margin-top: -1.5em;
        margin-bottom: 0.5em;
    }

    .managechoiceButtons {
        font-size: 31px;
        line-height: 30px;
    }
    a.managechoiceButtonsWrapp,
    div.managechoiceButtonsWrapp{
        line-height: 35px;
    }



    .manage_flowers {
        width: 25%;
    }

    .phonetext_field {
        padding: 0;
        width: 47%;
    }

    .changephonelink {
        margin-top: 8px;
        margin-bottom: -8px;
    }

    .you_have_tokens {
        width: 43%;
        height: 5em;
    }

    #bottom_container_buy_tokens span {
        font-size: 22px;
        line-height: 2.5em;
    }

    #ageCheckPopupInner h1 {
        font-size: 25px;
    }

    #ageCheckPopupDiv > #ageCheckPopupInner > ul {
        font-size: 11px;
    }

    .videosRow video {
        height: 5.7em;
    }

    #viewpost_button, #editpost_button {
        width: 140px;
        height: 50px;
    }

    p.success {
        padding: 0 16px;
    }

    .candy .black_px16 {
        font-size: 14px;
    }

    .betatag {
        width: 46px;
        height: 26px;
        right: 72%;
        top: 11px;
        background: url('../img/betatag.png') no-repeat;
        background-size: 100% 100%;
        position: absolute;
    }

    .contactus .betatag, #termsandconditions .betatag, .privpolicy .betatag {
        right: 68% !important;
        background: url('../img/betatag.png') no-repeat;
        background-size: 100% 100%;
        position: absolute;
    }

    .profiledit .betatag {

        right: 48% !important;
        background: url('../img/betatag.png') no-repeat;
        background-size: 100% 100%;
        position: absolute;

    }

    .loginpage .betatag {
        right: 68% !important;
        background: url('../img/betatag.png') no-repeat;
        background-size: 100% 100%;
        position: absolute;
        top: 30px;
    }

    .brief .betatag, .gallery .betatag {
        right: 47% !important;
    }

    .singlepost .betatag {
        right: 58% !important;
        top: 14px;
    }

    .singlepost #megapersonalsPageHeader {
        margin-right: 10px;
    }

    .managepostpage .betatag {
        top: 27px;
        right: 155px;
        left: auto;
        width: 46px;
        height: 27px;
        z-index: 9000;
    }

    .candy .betatag {
        top: 30px;
        right: 176px;
        left: auto;
        width: 46px;
        height: 27px;
        z-index: 9000;
    }

    .successpage .betatag {
        right: 67%;
    }

    .listview #list {
        margin: 30px 0px -12px 0px;
    }

    .candy label[for="is_mail_checkbox"], .candy label[for="is_phone_checkbox"] {
        margin-left: 0.7em;
    }

/*     .postadforfree_words_inner {
        top: 122px;
        width: 94px;
        left: 7%;
    } */

    .listcontent {
        width: 87%;
    }

    /*----- Payment Product List  -----*/
    .prodectList_heaser_info{
        font-size: 18px;
        margin-top: 100px;
    }
}

/* End below 480 */

/* Start below 420 */
@media screen and (max-width: 420px){
    .prodectList_heaser_info{
        font-size: 16px;
        margin-top: 80px;
    }
    .contact_massage {
        font-size: 1.3rem;
    }

    .addphotoheading {
        margin: 2em 0 -7x 0;
        margin-top: 20px;
    }

    .addvideoheading {
        margin: 1em 0 6px 0px;
    }
}
/* End below 420 */



/* Start below 375 */
@media screen and (max-width: 375px){
    .prodectList_heaser_info{
        font-size: 15px;
        margin-top: 65px;
    }


}
/* End below 375 */

/* start below 320 -- iphone 5 and under */

@media screen and (max-width: 320px) {

    #megap4choiceTopText {
        font-size: 10px;
    }

    #megap4choiceTopText .found_mostrecent {
        font-size: 8.5px;
    }

    .megap4choiceButtons {
        font-size: 18px;
        line-height: 26px;
    }

    .meetnow_byline {
        font-size: 11px;
        bottom: 15px;
        right: 30px;
    }

    #back_button_from_second_form_page {
        width: 70px;
        height: 35px;
        margin-top: 30px;
    }

    .preview_byline {
        font-size: 14px;
        bottom: 11px;
    }

    .changeCityLink {
        font-size: 10px;
    }

    .mpcityname {
        font-size: 10pt;
    }

    a.navtext {
        font-size: 7pt;
    }

    .fp_buttons {
        padding-top: 1.9em;
    }

    .list_city .mpcityname, .list_city .changeCityLink {
        font-size: 10px;
    }

    .circle {
        font-size: 15px;
        height: 20px;
        width: 20px;
        line-height: 20px;
    }

    #manageTopText {
        font-size: 9px;
        margin-bottom: 0.5em;
    }

    .managechoiceButtons {
        font-size: 26px;
        line-height: 25px;
    }

    .manage_flowers {
        width: 25%;
    }

    .changephonelink {
        font-size: 12px;
    }

    .you_have_tokens {
        height: 4.5em;
    }

    #bottom_container_buy_tokens span {
        font-size: 20px;
    }

    .form_element {
        margin: 0.5em;
    }

    #ageCheckPopupDiv {
        position: absolute;
    }

    #ageCheckPopupInner {
        position: relative;
        transform: none;
/*         top: 0;
        left: 0; */
    }

    #ageCheckPopupInner h1 {
        font-size: 22px;
    }

    .phonetext_field {
        width: 40%;
    }

    #photolabel {
        position: relative;
        float: left;
        top: 5px;
    }

    .videosRow video {
        height: 4em;
    }

    #viewpost_button, #editpost_button {
        width: 135px;
        height: 47px;
    }

    .betatag {
        width: 39px;
        height: 26px;
        right: 72%;
        top: 11px;
    }

    .contactus .betatag, #termsandconditions .betatag, .privpolicy .betatag {
        right: 68% !important;
        top: 10px !important;
        background: url('../img/betatag.png') no-repeat;
        background-size: 100% 100%;
        position: absolute;
    }

    .loginpage .betatag {
        right: 68% !important;
        top: 25px !important;
    }

    .brief .betatag, .gallery .betatag {
        right: 47% !important;
    }

    .singlepost .betatag {
        right: 58% !important;
        top: 14px;
    }

    .singlepost #megapersonalsPageHeader {
        margin-right: 10px;
    }

    .managepostpage .betatag {
        top: 25px;
        right: 136px;
        left: auto;
        width: 39px;
        height: 23px;
        z-index: 9000;
    }

    .candy .betatag {
        top: 31px;
        right: 150px;
        left: auto;
        width: 39px;
        height: 23px;
        z-index: 9000;
    }

    .postadforfree_words_inner {
        top: 97px;
        width: 78px;
        left: 26px;
    }

    .listcontent {
        width: 83%;
    }

    .prodectList_heaser_info{
        font-size: 13px;
        margin-top: 50px;
    }

    .exchange_rates{
        font-size: 12px;
    }

}

#sent_sms_confirmation_cover {
    width: 100%;
    height: 100%;
    background-color: white;
    z-index: 2000;
}

.betatag {
    background: url('../img/betatag.png') no-repeat;
    background-size: 100% 100%;
    position: absolute;
}

.singlepost .betatag {
    right: -10px;
}

.contactus .betatag, #termsandconditions .betatag, .privpolicy .betatag {
    right: 68%;
    left: auto;
    top: 20px;
}

.loginpage .betatag {
    right: 68%;
    left: auto;
    top: 40px;
}

#create_edit_post_age_field_errmessage {
    position: relative;
    left: -6px;
}

#postreportlink {
    background: #fdf889;
    padding: 1px 5px;
    border-radius: 5px;
    margin: 10px 5px;
    display: inline-block;
    color: #858584;
    font-size: 12px;
}

.errorclose {
    display: inline-block;
    float: right;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
}

/* profile display */

#profile_moreinfo {
    display: block;
    margin: auto;
    max-width: 280px;
}

#escortProfile {
    padding: 1em;
    margin: 1em;
}

#escortProfile h1 {
    background: #d7fdf8;
    font-size: 25px;
    padding: 10px;
    font-weight: bold;
}

@media screen and (max-width: 480px) {
    #escortProfile {
        padding: 5px;
        margin: 0;
    }
}

table.profile_stats {
    border: 3px solid #fde35a;
    font-weight: bold;
}

.profile_stats tr:nth-child(odd) {
    background: #fbe8ae;
}

.profile_stats tr:nth-child(even) {
    background: #fcfce0;
}

.profile_stats td {
    display: inline-block;
    padding: 2px !important;
}

td.profile_term {
}

.profile_stats td {
    border: none;
    border-top: 0 !important;
}

.statsheader {
    text-align: center;
    background: #fde35a;
    margin-bottom: -1px;
    font-weight: bold;
    padding: 5px;
    text-transform: uppercase;
}

.profile_text {
    color: #91184d;
}

.profile_rate {
    color: #3a8236;
}

.profile_name {
    color: #ff0082;
}

/*Profile About*/
.profile_about {
    margin: 0 0 10px;
    border: 3px solid #fee4e7;
    background: #f6f2f1;
    color: #513738;
    font-weight: bold;
    font-size: 12px;
    border-radius: 10px;
}

.profile_about > div {
    padding: 10px;
}

.profile_about h3 {
    color: #4e3433;
    text-align: center;
    margin: 0;
    background: #fee4e7;
    padding: 3px;
    font-weight: bold;
    text-transform: uppercase;
}

/*Profile Latest*/
.profile_latest {
    margin: 0 0 10px;
    border: 3px solid #fdf41b;
    background: #ededd3;
    color: #9c1861;
    font-weight: bold;
    font-size: 12px;
    border-radius: 10px;
    text-align: center;
    font-size: 16px;
}

.profile_latest > div {
    padding: 10px;
}

.profile_latest h3 {
    color: #000;
    text-align: center;
    margin: 0;
    background: #fdf41b;
    padding: 3px;
    font-weight: bold;
    text-transform: uppercase;
    font-style: italic;
}

/*Profile Wishlist*/
.profile_wishlist {
    margin: 0 0 10px;
    border: 3px solid #fee4e7;
    background: #f6f2f1;
    color: #513738;
    font-weight: bold;
    font-size: 12px;
    border-radius: 10px;
}

.profile_wishlist > div {
    padding: 10px;
}

.profile_wishlist h3 {
    color: #4e3433;
    text-align: center;
    margin: 0;
    background: #fee4e7;
    padding: 3px;
    font-weight: bold;
    text-transform: uppercase;
    -webkit-border-top-left-radius: 10px;
    -webkit-border-top-right-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

/* View Profile Link */
.linktoprofile {
    display: inline-block;
    position: relative;
    float: right;
    margin: 5px 10px 5px -10px;
    background-color: fuchsia;
    padding: 1px 5px;
    font-size: 9pt;
    color: #fff !important;
    border-radius: 3px;
}

/* Profile form */

.panel-profile {
    padding-bottom: 10px;
    border-radius: 0;
    -webkit-border-radius: 0;
    -webkit-box-shadow: 2px 3px 14px 0px rgba(0, 0, 0, 0.16);
    -moz-box-shadow: 2px 3px 14px 0px rgba(0, 0, 0, 0.16);
    box-shadow: 2px 3px 14px 0px rgba(0, 0, 0, 0.16);
}

.panel-profile .form_element {
    width: 50%;
    float: left;
    margin: 0;
    padding: 0 10px;
}

@media screen and (max-width: 480px) {

    .panel-profile .form_element {
        width: 100%;
    }

}

.panel-profile .form_element.last {
    width: 100%;
}

.panel-profile .form_element h3 {
    font-size: 14px;
    text-transform: uppercase;
    background: #f0f0f0;
    padding: 5px;
    font-weight: bold;
    margin-bottom: 0;
    margin-top: 10px;
}

.makeown_top {
    margin-bottom: 5px;
}

.editprofile_header {
    background: #d7fdf8;
    font-size: 25px;
    padding: 10px;
    font-weight: bold;
}

.notround {
    border-radius: 0;
    -webkit-border-radius: 0;
}

#profile_about_field {
    resize: vertical;
}

.updatemybio_button {
}

.superstar_link {
    font-size: 20px;
    color: white !important;
    background: fuchsia none repeat scroll 0% 0%;
    padding: 10px;
    border-radius: 40px;
    display: inline-block;
    margin: auto;
    text-align: center;
}

h1.successlink, h1.successlink a {
    text-align: center;
    cursor: pointer;
    font-weight: bold;
    color: cornflowerblue;
    font-size: 20px;
}

h1.successlink .manage-button {
    box-shadow: 0 0 0 60px rgb(0 0 0 / 0%) inset, 0.1em 0.1em 0.2em #0000005c;
    font-size: 26px;
}

@media (max-width: 430px) {
    h1.successlink .manage-button {
        font-size: 20px;
    }
}

@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) and (orientation: portrait) {
    /* iPhone 6 and iPhone 6+ portrait */
    h1.successlink, h1.successlink a {
        font-size: 14px;
    }
}

@media screen and (max-width: 320px) {
    h1.successlink, h1.successlink a {
        font-size: 12px;
    }
}

@media screen and (min-width: 768px) {
    #termsandconditions #button-ok {
        transform: scale(1);
    }
    #termsandconditions .modal-footer.flex-btn {
        padding-top: 16px;
    }
}

.widthFix {
    width: 90%;
    font-size: 18px;
    margin-left: auto;
    margin-right: auto;
}

.fixbag {
    padding-bottom: 25px;
}

.popup h2 {
    margin-top: 0;
    color: #00cbff;
    font-family: Tahoma, Arial, sans-serif;
    font-size: 19px;
    font-weight: bold;
}

.selectStyle {
    background: #f9a51c;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    padding: 5px;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 245px;
    margin-left: auto;
    margin-right: auto;
}

.selectStyle option {
    background: #fff;
    font-size: 14px;
    -moz-appearance: none;
    color: #c75400;
}

.selectPadding select {
    margin-top: 15px;
}

.ui-widget-overlay {
    opacity: .50;
    background-color: #000;
}

.ui-widget.ui-widget-content {
    position: fixed !important;
    /*margin-top: 16px;*/
    position: absolute;
    top: 50% !important;
    transform: translateY(-50%);
}

.ui-corner-all {
    border-radius: 7px;
}

.ui-widget select {
    font-size: 18px;
}

.ui-widget select option {
    font-size: 14px;
}

.ui-dialog .ui-dialog-content {
    width: 299px !important;
    height: auto !important;
    padding: 0.5em 0.1em;
    overflow: visible;
}

.ui-dialog .ui-dialog-content .container {
    margin-bottom: 10px;
}

.sponsore {
    width: 93%;
    /* height: 134px; */
    background: #eff0eb;
    display: block;
    border-radius: 15px 15px 15px 15px;
    -moz-border-radius: 15px 15px 15px 15px;
    -webkit-border-radius: 15px 15px 15px 15px;
    border: 0px solid #000000;
    text-transform: uppercase;
    padding-bottom: 10px;
}

.header-sponsore {
    text-align: center;
    text-transform: uppercase;
    background: #dedddb;
    color: #fff;
    border-radius: 15px 15px 0px 0px;
    -moz-border-radius: 15px 15px 0px 0px;
    -webkit-border-radius: 15px 15px 0px 0px;
}

.sponsore ul {
    list-style: none;
    margin-left: -40px;
}

.sponsore ul li {
    margin-top: 18px;
    text-align: center;
}

.sponsore ul li a {
    font-weight: bold;
    color: #939391;
    text-decoration: underline;
    display: inline-block;
}

#cityChoiceActivateLink {
    color: #fcb9e3;
}

.fixed-table-body {
    overflow: hidden;
    /*height: 100vh;*/
}

.sponsore-links {
    list-style: none;
}

.ui-dialog {
    z-index: 99999 !important;
    border-radius: 7px;
}

.ui-widget-header {
    border-bottom: 1px solid #aaaaaa;
}

.ui-dialog .ui-dialog-title {
    text-align: left;
    font-size: 14px;
}

.dialog-confirm-dlt .ui-dialog .ui-dialog-buttonpane button,
.dialog-confirm-dlt .ui-style-button {
    width: 50%;
}

.ui-dialog .ui-dialog-buttonpane button,
.ui-style-button {
    background: #177cea;
    color: #fff;
}

.ui-button .ui-icon,
.ui-button:hover .ui-icon {
    background: url(/resources/img/warning-close.jpg);
    width: 11px;
    height: 11px;
    margin-left: -6px;
    margin-top: -5px;
}

#warning-msg-body-id {
    width: 90%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

#warning-msg-body-id:before,
.btn-label-delete:before {
    content: "";
    background: url(/resources/img/warning.jpg);
    width: 16px;
    height: 13px;
    position: absolute;
    margin-left: -18px;
    margin-top: 4px;
}

.dialog-confirm-dlt .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    width: 105%;
    float: none;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.btn-label-delete {
    padding-left: 17px;
}

.g-recaptcha {
    margin-top: -30px;
    margin-bottom: 15px;
}

.loginform .g-recaptcha,
#emailForm .g-recaptcha,
#registerForm .g-recaptcha {
    top: unset;
    right: unset;
    margin-top: unset !important;
    margin-bottom: unset !important;
}

@media (max-width: 480px) {
    .dev {
        width: 80%;
        margin-bottom: 7px;
    }

    .phonetext_field .bi.bi-question-circle-fill {
        margin: 5px 0 0 5px !important;
    }

    .header-sponsore {
        font-size: 12px;
    }

    .sponsore ul {
        margin-top: -7px;
    }

    .sponsore {
        padding-bottom: 6px;
    }

    .sponsore ul li {
        margin-top: 18px;
    }

    .g-recaptcha {
        position: relative;
        top: -70px;
        right: 10px;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .paginationwrapper {
        margin-top: 30px;
    }

    .fromRight {
        display: block;
    }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 359px) {
    .sponsore-links img {
        left: -15px;
        position: relative;
    }
}

@media only screen and (min-device-width: 360px) and (max-device-width: 380px) {
    .sponsore-links img {
        left: -10px;
        position: relative;
    }
}

@media only screen and (min-device-width: 381px) and (max-device-width: 421px) {
    .sponsore-links img {
        left: -5px;
        position: relative;
    }
}

.dev {
    width: 84%;
}

.sponsore-links img {
    width: 100%;
    min-width: 120px;
    object-fit: contain;
    transform: translateX(-50%);
    margin-left: 50%;
}

.dropdown-city {
    overflow: scroll;
    height: 300px;
}

.dropdown-city li {
    color: #fff;
    background: #2c4f87;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-menu li {
    margin-top: 5px;
    border-radius: 5%;
}

.onOff {
    display: block;
}

.ui-accordion .ui-accordion-content {
    height: auto !important;
}

.accordion .ui-state-default,
.accordion .ui-widget-content .ui-state-default,
.accordion .ui-widget-header .ui-state-default,
.accordion .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    background: #2c4f87;
    color: #fff;
    font-weight: bold;
    font-size: 18px;
    color: #fff;
    padding: 5px;
    border: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    padding-left: 12px;
}

.ui-icon, .ui-widget-content .ui-icon {
    background-image: none;
    display: none;
}

.ui-widget-content {
    border: none;
}

.cityPrefix {
    color: #fff !important;
    border-radius: 4px;
    font-size: 14px !important;
}

.city {
    text-align: left;
    color: #c19e1d;
    cursor: pointer;
}

.ui-accordion .ui-accordion-content {
    padding: 1em 0.7em;
}

.city_list {
    padding: 1em 1.3em;
}

.btn-center .ui-dialog-buttonpane .ui-dialog-buttonset {
    width: 43%;
    float: none;
    margin-left: auto;
    margin-right: auto;
}

.btn-center .ui-dialog-buttonpane {
    padding: 0;
}

.ui-dialog .ui-dialog-buttonpane {
    padding: .0em 0em 1em .0em;
}

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    float: none;
    text-align: center;
}

.notifyjs-removed-post-base {
    opacity: 0.95;
    width: 200px;
    background: #1ac782;
    padding: 5px;
    border-radius: 10px;
}

.notifyjs-removed-post-base .notify-title {
    font-size: 12pt;
    width: 100px;
    float: left;
    margin: 5px 0 0 5px;
    text-align: right;
}

.table-agree-to-terms tr td {
    padding-top: 15px;
    padding-left: 10px;
}

.checkbox-agree {
    display: none;
}

.checkbox-custom {
    position: relative;
    width: 20px;
    height: 20px;
    border: 2px solid black;
}

.checkbox-custom,
.label {
    display: inline-block;
    vertical-align: middle;
}

.checkbox-agree:checked + .checkbox-custom::before {
    content: "";
    display: block;
    position: absolute;

    top: 2px;
    right: 2px;
    bottom: 2px;
    left: 2px;
    background: black;
}

.btn-agree-wrap input[type="submit"] {
    background: #27b900;
    width: 155px;
    height: 40px;
    color: #fff;
    border: none;
    font-weight: bold;
    margin-top: 10px;
    font-size: 16px;
    cursor: pointer;
}

.info_tokens {
    color: #fdf41b;
}

.not-abuse-link {
    font-size: 1.5em;
}

.support-request-info {
    font-family: Noto Sans, sans-serif;
    font-weight: normal !important;
    font-size: 1em;
    color: red;
}

.modal-dialog-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) !important;
}

#confirmModal_enoughTokens > .modal-dialog,
#confirmModal_notPublished > .modal-dialog,
#verificationModal_notPublished > .modal-dialog {
    width: auto !important;
}

#exceed-payment-limit-modal .modal-dialog {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0;
}

#exceed-payment-limit-modal .modal-dialog .modal-content {
    width: 400px;
    max-width: 90%;
}

#exceed-payment-limit-modal .modal-content {
    margin: 0 auto;
}

#exceed-payment-limit-modal .modal-footer {
    text-align: center;
}

.loader{
    width: 200px;
    height: 100px;
    border-radius: 100%;
    position: relative;
    margin: 0 auto;
}

#loader:before, #loader:after{
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    border: 10px solid transparent;
    border-top-color: #3498db;
}

#loader:before{
    z-index: 100;
    animation: spin 1s infinite;
}

#loader:after{
    border: 10px solid #ccc;
}

@keyframes spin{
    0%{
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100%{
        -webkit-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#loader-4 span{
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    background-color: #d12222;
    margin: 35px 5px;
    opacity: 0;
}

#loader-4 span:nth-child(1){
    animation: opacitychange 1s ease-in-out 0.15s infinite;
}

#loader-4 span:nth-child(2){
    animation: opacitychange 1s ease-in-out 0.30s infinite;
}

#loader-4 span:nth-child(3){
    animation: opacitychange 1s ease-in-out 0.45s infinite;
}

#loader-4 span:nth-child(4){
    animation: opacitychange 1s ease-in-out 0.59s infinite;
}

@keyframes opacitychange{
    0%, 100%{
        opacity: 0;
    }

    60%{
        opacity: 1;
    }
}
.payment-transaction-table table {
    width:100%;
    white-space: nowrap;
}

.payment-transaction-table p {
    writing-mode: vertical-rl;
}

.payment-transaction-table table td {
    padding: 0 0;
    /*white-space: nowrap;*/
}

.payment-transaction-table td[data-title="response_message"] {
    max-width: 200px;
    overflow-wrap: break-word;
}

.payment-transaction-table td[data-title="response_reference"] {
    max-width: 130px;
    overflow-wrap: break-word;
}

.payment-transaction-table td[data-title="payment_provider"] {
    max-width: 130px;
    overflow-wrap: break-word;
}

.payment-transaction-table td[data-title="status"] {
    max-width: 130px;
    overflow-wrap: break-word;
}

@media screen and (max-width: 768px) {
    .payment-transaction-table td[data-title="currency"],
    .payment-transaction-table th[data-field="currency"],
    .payment-transaction-table td[data-title="state_code"],
    .payment-transaction-table th[data-field="state_code"] {
        max-width: 40px !important;
        overflow-wrap: break-word;
    }
    .payment-transaction-table td[data-title="user"],
    .payment-transaction-table th[data-field="user"],
    .payment-transaction-table td[data-title="payment_provider"],
    .payment-transaction-table th[data-field="payment_provider"],
    .payment-transaction-table td[data-title="response_reference"],
    .payment-transaction-table th[data-field="response_reference"] {
        max-width: 60px !important;
        overflow-wrap: break-word;
    }
}

@media screen and (min-width: 769px) and (max-width: 1505px) {
    .payment-transaction-table td[data-title="currency"],
    .payment-transaction-table th[data-field="currency"] {
        max-width: 60px !important;
        overflow-wrap: break-word;
    }
    .payment-transaction-table td[data-title="state_code"],
    .payment-transaction-table th[data-field="state_code"] {
        max-width: 40px !important;
        overflow-wrap: break-word;
    }
    .payment-transaction-table td[data-title="user"],
    .payment-transaction-table th[data-field="user"],
    .payment-transaction-table td[data-title="payment_provider"],
    .payment-transaction-table th[data-field="payment_provider"],
    .payment-transaction-table td[data-title="response_reference"],
    .payment-transaction-table th[data-field="response_reference"] {
        max-width: 80px !important;
        overflow-wrap: break-word;
    }
}

.payment-transaction-table td[data-title="create_datetime"] {
    min-width: unset !important;
}

.payment-transaction-col {
    width: auto;
    text-align: center;
}
.payment-row-align-to-top {
    position:absolute;
    z-index: 100;
    top: 7em;
}
.payment-row-height {
    height: 100px;
}

.form-control-inline {
    min-width: 12%;
    width: 12%;
    display: inline;
}

.funkyradio div {
    clear: both;
    overflow: hidden;
}

.funkyradio label {
    /*width: 100%;*/
    border-radius: 3px;
    border: 1px solid #D1D3D4;
    font-weight: normal;
    padding-right: 5px;
}

.funkyradio input[type="checkbox"]:empty {
    display: none;
}

.funkyradio input[type="checkbox"]:empty ~ label {
    position: relative;
    line-height: 2.5em;
    text-indent: 3.25em;
    margin-top: 2em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.funkyradio input[type="checkbox"]:empty ~ label:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    content: '';
    width: 2.5em;
    background: #D1D3D4;
    border-radius: 3px 0 0 3px;
}

.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
    color: #888;
}

.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #C2C2C2;
}

.funkyradio input[type="checkbox"]:checked ~ label {
    color: #777;
}

.funkyradio input[type="checkbox"]:checked ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #333;
    background-color: #ccc;
}

.funkyradio input[type="checkbox"]:focus ~ label:before {
    box-shadow: 0 0 0 3px #999;
}

.funkyradio-default input[type="checkbox"]:checked ~ label:before {
    color: #333;
    background-color: #ccc;
}

.funkyradio-primary input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #337ab7;
}

.funkyradio-success input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5cb85c;
}

.funkyradio-danger input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #d9534f;
}

.funkyradio-warning input[type="radio"]:checked ~ label:before,
.funkyradio-warning input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #f0ad4e;
}

.funkyradio-info input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5bc0de;
}

.row-height-200-px {
    height: 200px;
}

.row-height-300-px {
    height: 300px;
}

.flex-direction-column {
    display: flex;
    flex-direction: column;
}

.row-height-400-px {
    height: 400px;
}

.row-height-300-px {
    height: 300px;
}

#search-report-form .checkbox-group {
    display: flex;
    justify-content: space-evenly;
    padding-top: 8px;
}

#pre-search-report-form .form-group label.control-label,
#search-report-form .form-group label.control-label {
    text-align: left;
}

.height-100-percent {
    height: 100%;
}
.height-width-100-percent {
    height: 100% !important;
    width: 100%;
}

.vertical-align-text-div {
    float: left;
    width: auto;
    height: 100%;
    line-height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.report-table-font {
    font-family: "Arial Black", Gadget, sans-serif;
    font-size: medium;
}

.report-table-font-title {
    font-style: italic;
    height: 27px;
}

.report-print-table-font-title {
    font-style: italic;
    font-size: 28px;
    font-weight: bolder;
    height: 32px;
}

.report-hr hr {
    color: brown;
    background-color: brown;
    height: 2px;
    width: 95%;
}

.text-center-align {
    text-align: center !important;
}

.verification-table-th-height {
    height: 70px !important;
}

.delete-provider {
    color: white !important;
    padding: 2px 4px 4px 3px;
}

.payment-providers table>tbody>tr:first-child td {
    border-top: none !important;
}

table#user-manager-table tbody>tr>td[data-title="search"] {
    max-width: 200px;
    overflow-wrap: break-word;
}

#TokenCoefficientForm {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
}

#TokenCoefficientForm,
.payment-providers .panel {
    max-width: 720px
}

.payment-providers .panel {
    margin-top: 10px;
}

.user-icon-styling {
    margin-left: 0.5em;
    font-size: large;
    float: right;
}

.remove_horizontal_scroll {
    overflow-x: hidden !important;
}

.forFloatingElements {
    columns: 2;
}

.simple-button {
    background: #1d89d6;
    color: white;
    width: max-content;
    margin: 0px auto;
    padding: 5px 14px;
    border: none;
    border-radius: 7px;
    box-shadow: 0px 3px 11px 0px #3c3c3c;
    cursor: pointer;
}
.simple-button:active {
    transform: translateY(2px);
    box-shadow: none;
}

.hint-container {
    display: flex;
    justify-content: center;
}
.hint-font {
    color: orange;
    font-weight: bold;
}
.hint {
    display: none;
    position: absolute;
    font-size: 19px;
    font-weight: 800;
}
.fader {
    position: fixed;
    display: none;
    justify-content: center;
    align-items: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000000a6;
}
.message-container {
    background-color: white;
    width: 80%;
    max-width: 314px;
    padding: 17px 12px;
    border-radius: 13px;
    box-shadow: 0px 4px 13px 1px #171717;
}

.payment-info-bar-wrapper {
    display: flex;
    justify-content: center;
    border-radius: 18px;
    background-color: #ec489196;
    padding: 8px 0;
    margin: 0 10px;
    border: 1px solid #00000038;
    box-shadow: inset 0 0 4px 2px #00000082;
}

.payment-info-bar-container {
    top: 238px;
    position: absolute;
    width: 100%;
}

@media screen and (min-width: 321px) and (max-width: 600px) {
    .extended-payment .payment-info-bar-container {
        top: calc(25vw + 64px);
    }
}

@media screen and (max-width: 320px) {
    .extended-payment .payment-info-bar-container {
        top: calc(25vw + 80px);
    }
}

.payment-info-bar {
    width: 100%;
    margin: 0 10px;
    padding: 5px 10px;
    font-family: Arial;
    border-radius: 9px;
    border: 4px solid #ff3523;
}
@media screen and (max-width: 400px) {
    .payment-info-bar h4 {
        font-size: 15px;
    }
    .payment-info-bar div > a {
        font-size: 12px;
    }
}
.payment-info-bar h4 {
    color: white;
    text-shadow: 4px 0 3px #9f1b52, -4px 0 3px #9f1b52, 0 4px 3px #9f1b52, 0 -4px 3px #9f1b52;
}

.payment-info-bar h4 {
    margin-bottom: 4px;
}

.payment-info-bar div>a {
    font-weight: bold;
    color: #b0c7e9;
    text-decoration: underline;
}

/*Phone verification styles*/

.phone-input-code {
    width: 50%;
    height: 30%;
    font-size: x-large;
    text-align: center;
    margin:auto;
}

.phonetext_field .bi.bi-question-circle-fill {
    position: absolute;
    font-size: 18px;
    margin: 14px 0 0 5px;
}
#tippy-1 {
    pointer-events: all !important;
}
.tippy-box .hint-message-box {
    width: 196px;
}
.tippy-box .hint-message-box .hint-message-box__message {
    text-align: center;
    padding-top: 5px;
}
.tippy-box .hint-message-box .hint-message-box__button {
    width: 49px;
    margin: 6px auto;
    border: 1px solid white;
    text-align: center;
    padding: 4px 0;
    cursor: pointer;
    transition-duration: .2s;
}
.tippy-box .hint-message-box .hint-message-box__button:active {
    transform: scale(0.91);
    transition-duration: .2s;
}
.sms-code-box {
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}
.rogue-box {
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}

.device-verification .message-container {
    width: 90%;
    box-shadow: 0px 0px 3000px 2000px rgb(255 255 255 / 67%);
}
.device-verification .message-container .panel-body {
    background-color: #e8e8e8;
}
.underline-link {
    text-decoration-line: underline;
}

.text-white {
    color: white !important;
}

.banned-message-small {
    width: 80%;
}

.dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
}

@supports (-webkit-touch-callout: none) {
    #postFormId #countrycode {
        padding-left: 8px!important;
    }
}

#postFormId .multiselect-dropdown-arrow {
    position: relative;
    margin-top: 0!important;
    transform: translateY(4px);
    cursor: pointer;
}

#postFormId .multiselect-wrapper .disabled {
    opacity: 0.5;
    pointer-events: none;
}

#postFormId #iseeCategories_inputCount {
    padding-top: 0px;
    padding-bottom: 4px;
    cursor: pointer;
}

#postFormId #iseeCategories_input {
    padding-left: 12px;
    margin: 0;
    cursor: pointer;
}

@media screen and (min-width: 381px) {
    #postFormId .iam-isee--wrapper .fromLeft {
        padding-right: 2px;
    }
    #postFormId .iam-isee--wrapper .fromRight {
        padding-left: 2px;
    }
    #postFormId .name-age--wrapper .fromLeft {
        padding-right: 2px;
    }
    #postFormId .name-age--wrapper .fromRight {
        padding-left: 2px;
    }
}

.pin-code-container {
    display: flex;
    justify-content: center;
    gap: 10px;
    grid-gap: 10px;
}
.pin-code {
    width: 40px;
    height: 50px;
    text-align: center;
    font-size: 30px;
    border: 2px solid black;
    caret-color: transparent;
    padding: 0 0 0 0 !important;
}
input.pin-code::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input.pin-code[type=number] {
  -moz-appearance: textfield;
}
@media screen and (max-width: 393px) {
    .confirmation-text {
        font-size: 6vw!important;
    }
}
@media screen and (max-width: 414px) {
    h3.verification-text {
        font-size: 18px!important;
    }
}

.checkbox-other {
    display: block;
    margin: 0 0 10px 0;
    cursor: pointer;
    user-select: none;
    position: relative;
}
.checkbox-other input[type=checkbox] {
    position: absolute;
    z-index: -1;
    opacity: 0;
    display: block;
    width: 0;
    height: 0;
}
.checkbox-other span {
    display: inline-block;
    position: relative;
    padding: 0 0 0 35px;
    line-height: 22px;
}
.checkbox-other span:before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 22px;
    position: absolute;
    left: 0;
    top: 0;
    transition: background 0.3s ease;
    background: url(/resources/img/checkbox-1.png) 0 0 no-repeat;
}

/* Checked */
.checkbox-other input[type=checkbox]:checked + span:before {
    background-image: url(/resources/img/checkbox-2.png);
}

/* Focus */
.focused span:before {
    box-shadow: 0 0 0 0.2rem rgba(0,123,255,.25);
}

/* Hover */
.checkbox-other span:hover:before {
    filter: brightness(110%);
}

/* Active */
.checkbox-other span:active:before {
    filter: brightness(80%);
}

/* Disabled */
.checkbox-other input[type=checkbox]:disabled + span {
    color: #666;
    cursor: default;
}
.checkbox-other input[type=checkbox]:disabled + span:before {
    filter: grayscale(100%);
    opacity: 0.6;
}

.container.pending-images {
    height: 100vh;
    background-image: linear-gradient(#fe2bab, transparent 50%, transparent);
}

.double-separator {
    margin: 16px auto;
    border: 1px solid black;
    height: 8px;
}
footer#footer {
    color: black;
    background-color: #e0e6ed;
    margin-top: 0;
    padding-top: 16px;
    padding-bottom: 72px;
}
/* Pinned to the viewport instead of flowing with #footer, so it's always visible
   while scrolling, not just once you reach the bottom of the page. Bottom-left
   rather than centered so it doesn't sit on top of the centered scroll-to-top
   arrow (.scrollTopWrapper). */
footer#footer nav ul {
    position: fixed;
    left: 12px;
    bottom: 16px;
    z-index: 5;
    width: auto;
    max-width: none;
    margin: 0;
}
footer#footer nav {
    padding: 0;
}

/* Same white/pink-border card language as .post_title_caption, .bump-timer and
   .post-pager — larger and legible without the heavy embossed manage-button look
   this had briefly (dark border, gradient fill, uppercase text-shadow), and no
   underline since it now reads as a pill, not a text link. */
.logout-pill {
    display: inline-block;
    background: #ffffff;
    border: 2px solid #ff86c7;
    border-radius: 999px;
    padding: 10px 22px;
    font-family: inherit;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    color: #aa1f54;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .15);
}

@media screen and (max-width: 460px) {
    footer#footer > nav > ul > li:nth-child(4) {
        /* display: block; */
        /* visibility: hidden; */
        /* height: 0; */
    }
    footer#footer nav ul {
        bottom: 3vw;
    }
    .logout-pill {
        font-size: 4.4vw;
        padding: 2.6vw 5vw;
        border-width: 1.5px;
    }
}

/* Ghost-button treatment on phones — this pill sits fixed on top of post
   content (it's pinned to the viewport, not the page flow), so a solid white
   fill blocks whatever is behind it. A translucent pink wash instead of fully
   transparent so it still reads clearly against light and dark content alike,
   and matches the pink border/text instead of looking washed out. */
@media screen and (max-width: 600px) {
    .logout-pill {
        background: rgba(255, 134, 199, .22);
        box-shadow: none;
    }
}

/* Post pager, sitting just above the footer. Same two-layer card as
   .post_title/.post_title_caption (and .bump-timer-wrap/.bump-timer above it): an
   outer muted-tan bordered box (.post-pager) around the inner white, pink-bordered
   one (.post-pager ul) — not just the single inner border on its own. */
.post-pager {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 18px auto 22px;
    padding: 4px;
    border: 3px solid #d2c4bd;
    border-radius: 18px;
    background-color: #faf4d8;
    width: 95%;
    max-width: 500px;
    box-sizing: border-box;
}
.post-pager ul {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    list-style: none;
    border: 3px solid #ff86c7;
    border-radius: 14px;
    padding: 14px 12px;
    margin: auto;
    font-size: 18px;
    font-weight: 700;
    flex: 1 1 auto;
    min-width: 0;
    color: black;
    background: #ffffff;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .15);
    box-sizing: border-box;
}
.post-pager ul li a {
    color: #aa1f54;
    text-decoration: none;
    background: #fff0f6;
    border: 2px solid #ff86c7;
    padding: 8px 16px;
    border-radius: 999px;
    display: inline-block;
    transition: background .15s ease, color .15s ease;
}
.post-pager ul li a:hover,
.post-pager ul li a:active {
    background: #ff86c7;
    color: #fff;
}
.post-pager ul li span.disabled {
    color: #b9b9b9;
    padding: 10px 18px;
    display: inline-block;
}
.post-pager ul li span.post-pager-count {
    color: black;
    font-weight: 800;
    padding: 10px 4px;
}
@media screen and (max-width: 460px) {
    .post-pager {
        width: 95vw;
        border-width: 2px;
        border-radius: 5vw;
    }
    .post-pager ul {
        font-size: 4.4vw;
        gap: 2vw;
        padding: 3.4vw 2vw;
        border-width: 2px;
    }
    .post-pager ul li a {
        border-width: 1.5px;
    }
    .post-pager ul li a,
    .post-pager ul li span.disabled {
        padding: 2.8vw 3.6vw;
    }
}
.verification-failed .modal-body {
    margin-top: 32px;
    margin-bottom: 16px;
}
.verification-failed .modal-body p {
    font-weight: 900;
    color: black;
    font-size: 18pt;
}
.verification-failed .modal-body p#info {
    color: #9e8669;
    font-weight: normal;
}
a.resend-code {
    color: #5cb85c !important;
}
a.resend-code:hover,
a.resend-code:active {
    color: #255625 !important;
}