*{
border: 0;
margin:  0;
padding: 0;
box-sizing: border-box;
}
*:before,
*:after {
box-sizing: border-box;
}
h1, h2, h3, h4, h5, h6, ul, p, form, input {
margin: 0px;
padding: 0px;
outline: none;
list-style-type: none;
}
button:focus {outline:0;}
button {border: 0;}
a {text-decoration: none;}
::-webkit-scrollbar {
width: 7px;
height: 7px;
}
::-webkit-scrollbar-track {
border-radius: 16px;
background-color: transparent;
}
::-webkit-scrollbar-thumb {
border-radius: 16px;
background-color: rgba(255, 255, 255, 0.5);
}
html, body {
font-family: Josefin Sans , sans-serif;
width: 100%;
height: 100%;
}
body.bg-pre {
background-image: url(../images/bg.jpg);
background-position: top center;
background-size: cover;
}
body.bg-defalut {
background-color: #000;
}
input, button {
font-family: 'Open Sans', "微軟正黑體", "Microsoft JhengHei", sans-serif;
}
.clearfix {
clear: both;
display: block;
width: 100%;
}
#prebox {
position: absolute;
top: 30%;
left: calc(50% - 150px);
width: 300px;
height: auto;
padding: 40px 16px 20px;
background-color: rgb(216 216 216 / 90%);
border-radius: 15px;
border: 2px dashed #000;
}
.slideItem {
width: 100%;
text-align: center;
color: #0d192c;
}
.owl-carousel .owl-item .slideItem-icon {
display: block;
width: 60px;
height: 60px;
margin: 0 auto;
}
.slideItem h1 {
    padding-top: 35px;
    font-size: 30px;
    color: #000;
}
.slideItem p {
padding-top: 9px;
font-size: 16px;
height: auto;	
}
.owl-theme .owl-dots .owl-dot span {
background-color: #7a8390;
}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
background-color: #ffae00;
}
.prebox-nav {
position: absolute;
width: 100%;
top: 50px;
z-index: 1;
}
.prebox-nav img {
position: absolute;
cursor: pointer;
}
.prebox-nav img:hover {
opacity: 0.6;
}
.prebox-left {
left: 0;	
}
.prebox-right {
right: 32px;
}
.btn {
height: 50px;
line-height: 55px;
border-radius: 15px;
background-color: #ffae00;
font-size: 26px;
font-weight: bold;
color: #000;
text-align: center;
cursor: pointer;
}
.btn:hover {
background-color: #000;
color: #fff;
}
.btn:active {
background-color: #ffae00
}
.prebox-btn {
margin-top: 25px;
width: 100%;	
}
/*#prebox:before {
content: "";
position: absolute;
width: 150px;
height: 18px;
top: -43px;
left: calc(50% - 75px);
background-image: url(../images/logo_AFF.png);
<span style="color: #fff;font-size: 26px;font-weight: bold;">BRANDNAME</span>
background-size: 100%;
}*/
#loadingbox {	
display: none;
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-color: #ffae00;
z-index: 3;	
}
#loadingbox.show {
display: flex;
justify-content: center;
align-items: center;
}
#loadingbox div {
width: 100%;
color: #fff;
height: 60px;
font-size: 16px;
font-weight: 600;
text-align: center;
}
.loadingbox-txt {
position: relative;
width: 100%;
height: 20px;
margin-bottom: 20px;
text-align: center;
}
.loadingbox-txt li {
position: absolute;
width: 100%;
top: 0;
opacity: 0;
animation-name: loadingtxt;
animation-duration: 1s;
color: #000;
}
.loadingbox-txt li:nth-child(2) {
animation-delay: 1s;
}
.loadingbox-txt li:last-child {
animation-delay: 1s;
}
footer {
display: none;
position: absolute;	
bottom: 0;
width: 100%;
height: 50px;
background-color: #ffae00;
}
footer>div {
flex: 0 0 30%;
display: flex;
justify-content: center;
align-items: center;
}
.footer-chat,  .footer-cruising {
position: relative;
cursor: pointer;
width: 30px;
height: 30px;
}
.footer-chat {
background-image: url(../images/chat.svg);
}
.footer-chat:after,
.footer-cruising:after {
display: none;
content: '';
position: absolute;
top: -10px;
left: 8px;
width: 0;
height: 0;
border-style: solid;
border-width: 6px 6.5px 0 6.5px;
border-color: #768eb8 transparent transparent transparent;
}
.footer-chat:hover,
.footer-chat.show {
background-image: url(../images/chat_hover.svg);
}
.footer-cruising {
background-image: url(../images/cruising.svg);
}
.footer-cruising:hover,
.footer-cruising.show {
background-image: url(../images/cruising_hover.svg);
}
.footer-chat.show:after,
.footer-cruising.show:after {
display: block;
}
@keyframes loadingtxt {
0%   {opacity: 0;}
20%  {opacity: 1;}
80%  {opacity: 1;}
100% {opacity: 0;}
}
#chat-box {
display: none;
position: absolute;
left: 0;
bottom: 50px;
width: 33%;
height: 390px;
border-radius: 20px;
border: 8px solid #768eb8;
background-color: #07101e;
z-index: 2;
}
#chat-box h1,
#cruising-box h1 {
height: 40px;
line-height: 40px;
font-size: 16px;
color: #768eb8;
text-align: center;
border-bottom: 1px solid #768eb8;
}
.chat-box-desc {
padding: 60px 0 43px;
font-size: 16px;
color: #fff;
text-align: center;
}
.chat-btn {
width: 300px;
margin: 0 auto;
}
#cruising-box {
display: none;
position: absolute;
right: 0;
bottom: 50px;
width: 33%;
height: calc(100vh - 73px);
padding: 0 5px;
max-height: 790px;
border-radius: 20px;
border: 8px solid #768eb8;
background-color: #07101e;
z-index: 2;
}
.cruising-btn {
width: 250px;
margin: 5px auto 35px;
}
.cruising-list {
padding: 14px 15px;
height: calc(100vh - 203px);
max-height: 660px;
overflow-y: auto;
}
.cruising-list li {
width: 100%;
margin-bottom: 40px;
}
.cruising-timestamp {
font-size: 13px;
font-style: italic;
color: #fff;
font-weight: 400;
}
.cruising-content {
display: flex;
padding-top: 8px;
align-items: center;
}
.cruising-photo {
width: 60px;
height: 60px;
margin-right: 8px;
}
.cruising-talk {
display: inline-flex;
align-items: center;
font-size: 16px;
color: #000;
line-height: 22px;
padding: 9px 19px;
border-radius: 30px;
max-width: calc(100% - 133px);
background-color: #fff;
}
.cruising-icon {
width: 65px;
margin-left: auto;
text-align: center;
}
.cruising-icon img {
display: block;
margin: 0 auto;
width: 32px;
height: 32px;
}
.cruising-icon span {
display: block;
font-size: 13px;
color: #fff;
}
#mapbox {
display: none;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #07101e;
}
#mapbox.show,
footer.show {
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
}
.map-slide {
width: 260px;
height: calc(100vh - 50px);
}
.map-content {
position: relative;
width: calc(100% - 260px);
height: calc(100vh - 50px);
border: 8px solid #ffae00;
background-image: url(../images/map.jpg);
background-size: cover;
background-position: center;
}
.map-content.hidden>div {
transform: scale(0);
}
.ms1 {background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 100%), url(../images/left_1.jpg);}
.ms2 {background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 100%), url(../images/left_2.jpg);}
.ms3 {background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 100%), url(../images/left_3.jpg);}
.ms4 {background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 100%), url(../images/left_4.jpg);}
.map-sItem {
position: relative;
width: 100%;
height: calc(100vh - 50px);
background-size: cover;
background-position: center;
}
.map-sItem-info {
position: absolute;
width: 100%;
bottom: 70px;
text-align: center;
}
.owl-carousel .owl-item .map-sItem-info-icon {
display: block;
width: 60px;
height: 60px;
margin: 0 auto 12px;
}
.map-sItem-info-title {
padding: 0 20px;
margin-bottom: 20px;
font-size: 28px;
line-height: 38px;
font-weight: bold;
color: #fff;
text-align: center;
}
.map-sItem-info-btn {
display: inline-block;
padding: 0 15px;
margin: 0 auto 20px;
}
.map-sItem-info-next {
display: block;
width: 23px;
height: 38px;
margin: 0 auto;
background-image: url(../images/icon_right_white.png);
background-size: cover;
cursor: pointer;
}
.map-sItem-info-next:hover{
opacity: 0.6;
}
.p1 {background-image: url(../images/2.png);left: 5%;top: 36%;}
.p2 {background-image: url(../images/9.png);left: 7%;top: 86%;}
.p3 {background-image: url(../images/3.png);left: 15%;top: 18%;}
.p4 {background-image: url(../images/5.png);left: 32%;top: 18%;}
.p5 {background-image: url(../images/4.png);left: 46%;top: 2%;}
.p6 {background-image: url(../images/6.png);left: 51%;top: 33%;}
.p7 {background-image: url(../images/10.png);left: 68%;top: 75%;}
.p8 {background-image: url(../images/7.png);left: 81%;top: 14%;}
.p9 {background-image: url(../images/8.png);left: 83%;top: 56%;}
.map-ppl {
position: absolute;
width: 60px;
height: 60px;
border-radius: 50%;
background-color: #07101e;
box-shadow: inset 0px 0px 0px 3px #07101e;
border: 3px solid #768eb8;
background-size: 100%;
cursor: pointer;
transition: all 0.6s ease-in-out;
}
.map-ppl:hover,
.map-you:hover {
transform: scale(1.3);
}
.map-you {
position: absolute;
width: 140px;
height: 90px;
left: 40%;
top: 55%;
display: flex;
align-items: center;
cursor: pointer;
transition: all 0.6s linear;
}
.map-you span {
display: block;
width: 50px;
margin-right: -3px;
color: #fff;
font-size: 14px;
font-weight: bold;
height: 30px;
line-height: 30px;
text-align: center;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;
background-color: #4b84e6;
}
.map-you div {
width: 80px;
height: 80px;
border-radius: 50%;
background-color: #07101e;
box-shadow: inset 0px 0px 0px 3px #07101e;
border: 5px solid #4b84e6;
background-size: 100%;	
background-image: url(../images/1.png);
}
.profile-bg {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.7);
z-index: 2;
}
#myprofile-box {
display: none;
}
.profile-container {
position: relative;
width: 33%;
height: 100vh;
left: calc(50% - 16.5%);
text-align: center;
}
.profile-header {
position: relative;
height: 50px;
line-height: 50px;
font-size: 24px;
color: #000;
text-align: center;
background-color: #ffae00;
border-radius: 15px 15px 0px 0px;
}
.profile-content {
position: relative;
width: 100%;
height: calc(100% - 100px);
background-image: url(../images/1.jpg);
background-size: cover;
background-position: top;
}
.myprofile-info {
position: absolute;
width: 100%;
bottom: 8%;
}
.myprofile-info p {
padding: 0 14% 22px;
color: #000;
font-size: 16px;
font-weight: 700;
}
.myprofile-btn {
display: block;
width: 250px;
margin: 0 auto;
}
.myprofile-footer {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 50px;
background-color: #ffae00;
border-radius: 0px 0px 15px 15px;
}
.btn-profile-bk {
position: absolute;
width: 50px;
height: 50px;
left: 0;
cursor: pointer;
background-image: url(../images/back.svg);
background-size: 100%;
}
.btn-profile-bk:hover {
background-image: url(../images/back_hover.svg);
}
.btn-someonehome,
.btn-someonechat {
position: absolute;
top: 8px;
width: 32px;
height: 32px;
cursor: pointer;
}
.btn-someonehome {
left: 20px;
background-image: url(../images/home.svg);
}
.btn-someonehome:hover,
.btn-someonehome.show {
background-image: url(../images/home_hover.svg);
}
.btn-someonechat {
right: 20px;
background-image: url(../images/chat2.svg);
}
.btn-someonechat:hover,
.btn-someonechat.show {
right: 20px;
background-image: url(../images/chat2_hover.svg);
}
.someone-mainpage, .someone-home, .someone-chat {
display: none;
position: absolute;
width: 100%;
height: 100%;
}
.someone-mainpage.show, .someone-home.show, .someone-chat.show {
display: block;
}
.someone-status {
position: absolute;
top: 23px;
left: 29px;
font-size: 14px;
color: #fff;
}
.someone-status span {
display: inline-block;
margin-right: 5px;
width: 10px;
height: 10px;
border-radius: 50%;
background-color: #25f700;
}
.someone-desc {
position: absolute;
bottom: 25px;
left: 29px;
font-size: 18px;
color: #fff;
}
.someone-home, .someone-chat {
background-color: rgba(0,0,0,0.7);
}
.someone-home-content {
position: relative;
top: 18%;
width: 100%;
padding: 0 18%;
color: #fff;
text-align: center;
}
.someone-home-content h1 {
font-size: 20px;
padding-bottom: 20px;
font-weight: bold;
border-bottom: 3px solid #fff;	
}
.someone-home-content p {
padding: 18px 0 30px;
font-size: 16px;
}
.btn-someone-home {
display: inline-block;
width: 250px;
}
.someone-chat-bg {
position: absolute;
width: 65%;
left: 17.5%;
top: 20px;
opacity: 0.2;
}
.someone-chat-input {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 50px;
line-height: 50px;
padding: 0 50px 0 20px;
font-size: 16px;
color: #fff;
background-color: #0d1d38;
}
.someone-chat-btn {
position: absolute;
right: 20px;
bottom: 8px;
width: 32px;
height: 32px;
cursor: pointer;
}
.someone-chat-btn:hover {
opacity: 0.5;
}
.someone-chat-typing {
display: none;
position: absolute;
right: 17px;
bottom:  64px;
text-align: right;
}
.someone-chat-typing p {
padding-bottom: 11px;
font-size: 13px;
font-style: italic;
color: #fff;
}
.someone-chat-typing span {
display: inline-block;
color: #000;
font-size: 18px;
font-weight: 600;
height: 40px;
line-height: 40px;
border-radius: 20px;
background-color: #fff;
padding: 0 22px;
}
.someone-chat-reply {
display: none;
position: absolute;
top: 25px;
left: 17px;
padding: 10px 0;
width: 100px;
background-color: #fff;
border-radius: 20px;	
}
.myprofile-mask {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
z-index: 3;
}
.myprofile-mask-content {
margin: 40vh auto 0 ;
text-align: center;
}
.myprofile-mask-content p {
font-size: 20px;
color: #fff;
padding-bottom: 17px;
}
.btn-myprofile-mask {
display: inline-block;
width: 250px;
}
#warning-box {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);	
z-index: 3;
}
#warning-box div {
    position: relative;
    top: 100px;
    left: calc(50% - 237px);
    width: 475px;
    padding: 60px 38px 50px 38px;
    background-color: #fff;
    color: #000;
    text-align: center;
    border: 4px solid #ffae00;
    border-radius: 15px;
}
.warning-box-btn {
position: absolute;
top: 18px;
right: 18px;
width: 32px;
height: 32px;
background: url(../images/close.png) no-repeat center;
cursor: pointer;
}
#warning-box div h1 {
font-size: 20px;
font-weight: bold;
padding-bottom: 23px;
}
#warning-box div p {
font-size: 16px;
}
#reg-box {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
justify-content: center;
align-items: center;
z-index: 10;
opacity: 0;
transition: all 0.6s linear;
}
.reg-container {
width: 33%;
min-width: 474px;
height: 100%;
background-color: #000;
border-radius: 0;
}
.reg-header-logo {
height: 18px;
margin-top: 16px;
}
.reg-form {
width: 100%;
padding: 0 14%;
height: calc(100% - 100px);
overflow-y: auto;
}
[step="1"] #reg-back {
display: none;
}
/*------------  regform ------------  */
.hide,
.submit_alert,
div[data-form-field="handle_confirm"],
div[data-form-field="email_confirm"],
div[data-form-field="password_confirm"],
.writing_tool li[data-form-tool="instant_writer"],
.reg_consent_group02,
.pagination,
div#reg_consent_single,
#form-intro label .suggest,
[data-form-field="handle"] .suggest_list .subtitle,
.reg-form button.btn.btn-default.prev_link {
display: none;
}
.error, .help-block {
color: #f2385a;
}
.suggest {
position: relative;
display: block;
width: 100%;
}
.reg-form .loading {
position: absolute;
top: 8px;
left: calc(50% - 10px);
background: url('images/loading.gif') no-repeat;
background-repeat: no-repeat;
background-size: contain;
height: 20px;
width: 20px;
}
.reg_title {
padding-top: 80px;
padding-bottom: 5px;
}
.reg_title h1 {
display: none;
font-size: 24px;
color: #fff;
text-align: center;
font-weight: bold;
}
[step="1"] .reg_title h1.reg01,
[step="2"] .reg_title h1.reg02,
[step="3"] .reg_title h1.reg03,
[step="4"] .reg_title h1.reg04,
[step="5"] .reg_title h1.reg05 {
display: block;
}
.reg-form label {
position: relative;
display: block;
font-size: 14px;
color: #fff;
padding-bottom: 5px;
padding-top: 15px;
}
.reg-form label > b {		
font-size: 18px;
}
.reg-form select, 
.reg-form input[type="text"], 
.reg-form input[type="password"], 
.reg-form textarea {
width: 100%;
height: 50px;
display: block;
background-color: transparent;
border: 2px solid #fff;
border-radius: 10px;
font-size: 18px;
color: #fff;
text-indent: 18px;
cursor: pointer;
}
.reg-form select {
background: url(../images/select_arrow_wt.svg) no-repeat right 6px center;
-webkit-appearance: none;
}
.reg-form select::-ms-expand {
display: none;
}
.reg-form select option {
color: #000;
}
select[name^="bday_month"] {
width: 38%;
margin-right: 2%;
float: left;
}
select[name^="bday_day"] {
width: 29%;
margin-right: 2%;
float: left;
}
select[name^="bday_year"] {
width: 29%;
float: left;
}
.actions {
padding-top: 30px;
}
.next_link,
button[type="submit"] {
display: block;
text-align: center;
width: 100%;
height: 50px;
line-height: 50px;
background-color: #ffae00;
color: #000;
font-size: 16px;
font-weight: 700;
cursor: pointer;
}
.next_link:hover {
background-color: #fff;
color: #000;
}
.next_link:active {
background-color:#ffae00;
}
[data-form-field="looking-for"] .input label {
margin-bottom: 5px;
padding-top: 0;
}
[data-form-field="looking-for"] .input label input {
position: absolute;
width: 1px;
height: 1px;
opacity: 0;
}
[data-form-field="looking-for"] .input label span {
display: block;
width: 100%;
text-align: center;
font-size: 18px;
font-weight: normal;
border: 1px solid #fff;
border-radius: 10px;
height: 50px;
line-height: 50px;
cursor: pointer;
}
[data-form-field="looking-for"] .input label input:checked~span {
background-color: #fff;
color: #000;
font-weight: 600;
}
.help-block,
.zip_check,
.username_check,
.note-block,
.suggest_handles,
.suggest {
font-size: 13px;
}
.note-block,
.suggest {
color: #fff;
}
.suggest_handles,
.ok {
color: #29d9c2;
}
.reg-form a {
color: #42b7ff;
}
#form-intro-title label p,
#form-intro label p {
display: inline;
padding-left: 5px;
text-transform: capitalize;
color: #ff1e00;
font-size: 14px;
font-weight: bold;
}
.reg-form textarea {
height: 240px;
}
.reg-form .error input, .reg-form .error select {
border-color: #f2385a;
}
.submit_alert, .alert-error {
display: block;
font-size: 13px;
text-align: center;
color: #f2385a;
padding-top: 10px;
}
#form-recaptcha {
padding-top: 0;
}
.reg-fake-pageindicator {
position: absolute;
width: 100px;
left: calc(50% - 50px);
bottom: 32px;
display: flex;
justify-content: center;
}
.reg-fake-pageindicator li {
display: inline-block;
width: 10px;
height: 10px;
border-radius: 5px;
margin: 0 5px;
border: 2px solid #7a8390;
background-color: transparent;
}
[step="1"] .reg-fake-pageindicator li:nth-child(1),
[step="2"] .reg-fake-pageindicator li:nth-child(1),
[step="2"] .reg-fake-pageindicator li:nth-child(2),
[step="3"] .reg-fake-pageindicator li:nth-child(1),
[step="3"] .reg-fake-pageindicator li:nth-child(2),
[step="3"] .reg-fake-pageindicator li:nth-child(3),
[step="4"] .reg-fake-pageindicator li:nth-child(1),
[step="4"] .reg-fake-pageindicator li:nth-child(2),
[step="4"] .reg-fake-pageindicator li:nth-child(3),
[step="4"] .reg-fake-pageindicator li:nth-child(4),
[step="5"] .reg-fake-pageindicator li {
background-color: #ffae00;
border-color: #ffae00;
}
.sp-consent {
display: block;
color: #b5b5b5;
padding-top: 25px;
font-size: 13px;
}
.map-dialog-close {
position: absolute;
top: 4px;
right: 4px;
width: 32px;
height: 32px;
opacity: 0.4;
cursor: pointer;
}
.map-dialog-close:hover,
.reg-close:hover {
opacity: 0.8;
}
.reg-close {
    display: none;
    position: absolute;
    top: 17px;
    right: 9px;
    width: 20px;
    height: 20px;
    opacity: 1;
    cursor: pointer;
}
[step="1"] .reg-close {
display: block;
}
#popunder_legal {
position: absolute;
width: 100%;
text-align: right;
bottom: 7px;
right: 11px;
color: #ebebeb;
font-size: 12px;
}
@media only screen and (max-width: 900px) {
body.bg-pre {
background-image: url(../images/mobile_bg.jpg);
    background-size:contain;
    background-repeat: no-repeat;
    background-color: #af9c90;
}
#prebox {
top: 15%;
}
#warning-box div {
width: 100%;
top: 0;
left: 0;
padding: 44px 25px 30px 25px;
}
#warning-box div h1 {
padding-bottom: 12px;
}
.warning-box-btn {
top: 10px;
right: 10px;
}
footer>div img {
max-height: 18px;
}
#mapbox.show {
display: block;
height: calc(100% - 50px);
}
.map-slide {
width: 100%;
height: 100px;
}
.map-sItem {
height: 100px;
}
.map-sItem-info {
top: 0;
left: 0;
bottom: 0;
padding: 10px 70px 0 45px;
text-align: left;
}
.owl-carousel .owl-item .map-sItem-info-icon {
position: absolute;
top: 10px;
left: 0;
width: 40px;
height: 40px;
}
.map-sItem-info-title {
padding: 0;
margin-bottom: 10px;
font-size: 18px;
line-height: 20px;
height: 40px;
display: flex;
align-items: center;
text-align: left;
}
.map-sItem-info-btn {
font-size: 14px;
height: 30px;
line-height: 30px;
margin: 0;
}
.map-sItem-info-next {
position: absolute;
right: 8px;
top: 30px;
}
.map-content {
width: 100%;
height: calc(100% - 100px);
overflow: auto;
}
.p1 {left: 5%;top: 36%;}
.p2 {left: 27%;top: 106%;}
.p3 {left: 35%;top: 18%;}
.p4 {left: 62%;top: 18%;}
.p5 {left: 76%;top: 2%;}
.p6 {left: 85%;top: 53%;}
.p7 {left: 98%;top: 95%;}
.p8 {left: 111%;top: 34%;}
.p9 {left: 120%;top: 76%;}
.profile-container {
left: 0;
width: 100%;
height: 100%;
}
.myprofile-footer img {
max-height: 18px;
}
.ms1 {background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 100%), url(../images/bg_m_top_1.jpg);background-size: cover;background-position: center;}
.ms2 {background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 100%), url(../images/bg_m_top_2.jpg);background-size: cover;background-position: center;}
.ms3 {background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,0.3) 100%), url(../images/bg_m_top_3.jpg);background-size: cover;background-position: center;}
.someone-home-content {
padding: 0 15px;
}
#chat-box, #cruising-box {
width: 100%;
}
#cruising-box {
height: calc(100% - 50px);
}
.cruising-list {
height: calc(100% - 125px);
padding: 5px;
}
.cruising-list li {
margin-bottom: 35px;
}
.reg-container {
width: 100%;
min-width: 0;
}
.reg-form {
padding: 0 5%;
height: calc(100% - 80px);
}
.reg_title {
padding-top: 40px;
}
.reg-fake-pageindicator {
bottom: 10px;
}
#popunder_legal {
text-align: center;
padding: 0 5%;
bottom: 8px;
right: 0;
line-height: 15px;
}
}

#errorMsg{
    color: red;
    margin-top: 5px;
}