@charset "utf-8";

/* CSS Document */
body, div, ul, li { color: #222; font: normal 12px/18px Arial, Helvetica, sans-serif, Verdana; padding: 0; margin: 0; list-style: none; }
.clear { font: 0; padding: 0; margin: 0; clear: both; }
div, ul, ol, li, dl, dt, dd, a, img, form, p, h1, h2, h3, h4, h5, h6, span, input { margin: 0; padding: 0; border: 0px; }
input[type=button], input[type=submit] { -webkit-appearance: none; }
a:link, a:visited { color: #2A4A87; }
a:hover { color: #c20017; text-ecoration: underline; }
a img { border: 0; }
.girl_list ul li a:link, .girl_list ul li a:visited { text-decoration: none; }
input, select { outline: none; }
body { background-color: #000; /*background: url( ../images/bbg.jpg) repeat;*/ }
.clearfix:after { content:"."; display:block; height:0; clear:both; visibility:hidden; overflow:hidden; }
.clearfix{ *zoom:1;}
.hide{display: none;}
a.alink:link, a.alink:visited { color: #f4586a; }
a.alink:hover { color: #ff6b71; }
input[type=text] { -webkit-appearance: none; outline: none; }
input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 1000px white inset; }
select::-ms-expand { display: none; }
select { border: none; outline: none; appearance: none; -moz-appearance: none; -webkit-appearance: none; -ms-appearance: none; }
select { font-size: 14px; }
body{background: #000;}
.cl { clear: both; }
.fb_box{display: none;}

.content{position: relative; height: 1000px;width: 100%; background: url(../images/bg.jpg) no-repeat center top;}
.round-box{margin:0 auto;padding-top:70px;}
.round{ margin: 15px auto 0; width: 600px;height: 600px;display: block; border-radius: 50%; position: relative;background: #f3f9ff;border:6px solid #629bc9; z-index: 9; }
/*.round:after{content:""; display: block;position: relative; width: 640px;height: 640px;border:2px solid #7db6e7;left: 50%;margin-left: -320px;}

*/
.round-border{ margin:0 auto;display: block;position: relative; width: 640px;height: 640px;border:1px solid #b3ddff;border-radius: 50%; z-index: 9;}
.logo{margin:50px auto 40px;text-align: center;}
.title{ margin:0 auto;text-align: center;display: block;}

.reg_box{margin:0 auto;}
.signin{margin:10px auto 0;font-size: 12px;color: #999;text-align: center;}

.login_pop a:link{color: #f4586a;}
.login_pop a:hover{ color: #f94f5b; }

.lady_wrapper{position: absolute;left: 0;right: 0;top:0;bottom:0;height: 1000px;display: block;z-index: 1;width: 1500px;margin: 0 auto;}
.lady_1{position: relative;float: left;display: block;vertical-align: bottom;background: url() }
.lady_2{position: relative;float:right;display: block;vertical-align: bottom;padding-right: 100px;}

.lady_box{width: 880px;padding:10px 5px; margin:20px auto 0; display: block;border-radius: 6px;  background-image: -moz-linear-gradient( 95deg, rgba(18,24,49,0.30) 0%, rgba(255,255,255,0.30) 100%); 
  background-image: -webkit-linear-gradient( 95deg, rgba(18,24,49,0.30) 0%, rgba(255,255,255,0.30) 100%);
  background-image: -ms-linear-gradient( 95deg, rgba(18,24,49,0.30) 0%, rgba(255,255,255,0.30) 100%);
}
ul.lady_list li{float: left;margin:5px 10px; width: 124px;height: 160px;display: block;border-radius:4px; position: relative;overflow: hidden;border:1px solid #8accff;max-height: 240px;}
ul.lady_list li img{width: 100%;}
.name{position: absolute;left: 0;right: 0;bottom:10px;text-align: center;margin:0 auto;font-size: 13px;font-family:'Raleway',arial,Helvetica,sans-serif;color: #fff;font-style: italic;
  }

.footer{ width: 100%;text-align: center; font-size: 12px;color: #ddd;line-height: 1;padding:10px 0;margin:0 auto;z-index: 9; }
.footer .copyright{color: #ddd;}


.m_bg{ position: absolute;top:0;left: 0;right: 0;display: block;width: 100%;height: auto; min-height: 1400px; background-size: cover;z-index: 0;display: none;}
.m_1{background: url(../images/m_bg_1.jpg) top center no-repeat;}
.m_2{background: url(../images/m_bg_2.jpg) top center no-repeat;}

a#scroll_top{ position: fixed;bottom:40px;right: 20px;height: 64px;width: 64px;display: none;border-radius: 50%;background: #fff;background-color: rgba(255,255,255,0.95); color: #444;line-height: 64px;text-align: center;font-weight: normal;font-size:18px; text-decoration: none;}





/* TabbedPanels */
.TabbedPanels { margin:0; padding:0; }
.TabbedPanelsTabGroup { margin:0 0 -16px; padding:0; height:32px; text-align:center; position: relative;background: url(../images/line.png) no-repeat center center; }
.TabbedPanelsTab {display:inline-block; width:32px; height:32px; line-height:32px; text-align:center; -moz-user-select:none; -khtml-user-select:none; cursor:default; margin: 0 5px; border-radius:40px; font-size:18px;color:#8e8e8e; border:1px solid #aaa; box-sizing:border-box;}
.TabbedPanelsTabSelected { background:#63aae1; color:#fff;border:none;  }
.TabbedContent{ padding:30px 0 20px; color:#333; font-size:18px;background-position:center top; background-repeat:no-repeat;  background-position: center top;
    background-repeat: no-repeat;
}

/*facebook*/
.fb_box { margin-bottom:20px; padding:0; text-align:center; font-size:12px; color:#666; }
#login .fb_box { margin-bottom:0; }
.btn_fb{ width:225px; margin:0 auto 6px; text-indent:24px; background:#536daf url(../images/btn_fb_b01.jpg) no-repeat left; border-radius:4px; color:#333; }
.btn_fb a { font-size:14px; display:block; height:35px; line-height:34px; text-decoration:none; text-align:center; color:#333; }
.fb_or { font-size:12px; margin:14px 0; text-align:center; background:url(../images/fb_or.png) no-repeat center center; }

/* form */

#regForm select{ color: #000; }

#regForm { width:100%; margin:20px auto 0px; font-family: arial;}
.reg_area{max-width: 340px;margin:0 auto;}
.form-item { margin:15px 0; }
.form-label { font-size:16px; font-size:1rem;color: #333; float:left; width:24%; padding-top:10px; }
.form-con { float:left; width:76%;border-radius: 4px; }
.input_test, .input-group { width:100%; height:42px;  line-height:36px; line-height:2.25rem; box-sizing:border-box; background-color:#fff; border-radius:4px;   border:0;  text-indent: 4px;font-size: 14px;font-size: 0.875rem;border:1px solid #666;}
.input-group .input_test { font-size:14px; font-size:0.875rem; height:40px; height:2.375rem; }
.select-wrapper { width:100%; position:relative; overflow:hidden; z-index:0; height:42px; height:2.5rem; box-sizing:border-box; background-color:#fff; border:1px solid #999; border-radius:4px; }
.select-wrapper:after { display:block; content:""; position:absolute; width:9px; height:5px; right:10px; top:45%; background:url(../images/down_arrow.png) no-repeat right center;color: #111; }
.select-wrapper select { font-size:14px; font-size:0.875rem; float:left; width:109%; margin-top:3px; text-indent:4px; height:36px; /* inputbox height */ padding:3px; border:none;    background: #fff; }
.input-group .input_test, .input-group .select-wrapper { float:left; border:none; }
.input-group .select-wrapper { width:33%; height:40px;}
.input-group .select-wrapper select { width:130%; }
.input_desc { font-size:12px; line-height:1.8em; text-align:right; color:#ddd; }
.button_box { padding-top:6px; }
.submit-button { display:block; width:100%; text-decoration:none; height:52px; line-height:46px; font-size:24px; height:3.25rem; line-height:3.25rem; font-size:1.5rem; cursor:pointer; background-color:#fc6578!important;border:none; color:#fff; border-radius:4px; transition:all 0.3s; -webkit-transition:all 0.3s; margin-top:0 !important;font-weight: 400; transition:all 0.5s;}
.submit-button:hover { background-color:#f94f5b!important;     transition: all 0.5s;  -webkit-transition: all 0.5s;
    transform: scale(1.06);
    -moz-transform: scale(1.06);
    -webkit-transform: scale(1.06);
    -ms-transform: scale(1.06);
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.10);}
  #login .submit-button{ color: #fff!important;}
.terms_privacy { display:none; margin: 0 auto;width: 80%;max-width: 270px; color:#888; font-size:12px;text-align:center; padding-top:14px; line-height:1.4em;  }



/* for ie8 */
.ie.ie8 select { height:22px !important; }
.ie.ie8 .TabbedContent { border:1px solid #ccc; }

/* 如果没有定义这个，有可能在加载时一瞬间显示弹层 */
.popup-container { display:none; }

/* intsva */
.intsva { font-family:arial,Helvetica,sans-serif; position:absolute; z-index:98; line-height:1em; font-size:11px; /*font-size:0.7rem;*/ margin-top:-29px; padding:4px 6px; padding:0.25rem 6px; color:#fff; background-color:#e95265; border:1px solid #e95265; border-radius:0.2rem; box-shadow:0 2px 3px rgba(0,0,0,0.3); text-shadow:0 0 1px rgba(0,0,0,0.2);/*white-space: nowrap;*/ height: auto; }
.intsva .arrow { display:block; content:""; position:absolute; margin-left:10px; bottom:-6px; width:0px; height:0px; border-color:transparent; border-style:solid; border-width:6px 6px 0 6px; border-top-color:#e95265;/* use for arrow bgColor */ }
.intsva .arrow:after { display:block; content:""; position:absolute; margin-top:-5px; margin-left:-6px; width:0px; height:0px; z-index:-1; border-color:transparent; border-style:solid; border-width:6px 6px 0 6px; border-top-color:#e95265;/* use for arrow border */ }
#pointmsg_birthday_y { margin-left:-70px; }
#pointmsg_birthday_y .arrow { margin-left:70px; }

/* loading */
#load {z-index: 999;}
#load .loading-mask{
  position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 100%;height: 100%;z-index: 999;
  background-color: #161616; 
}
.loading{position: absolute;left: 50%;top:50%;margin-left: -64px;margin-top:12px; display: block;z-index: 1001;}
.loading_holder {
    position: fixed;
    z-index: 1001;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    width: 100%;
    height: 100%;
    background-color: #000;
/*    opacity: 0.75;
    filter: alpha(opacity=75);*/
}
.loading_preloader {
    position: absolute;
    width: 10%;
    height: 0%;
    padding-bottom: 10%;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.loading_preloader div {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    overflow: hidden;
    animation: animatePreloader 1s infinite linear;
    transform-origin: 50% 100%;
}
.loading_preloader div:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 50%;
    top: 50%;
    transform: translateX(-50%);
    border: 3px solid #f94f5b;
    border-radius: 50%;
    box-sizing: border-box;
}
.loading_preloader div:nth-child(2) {
    width: 60%;
    height: 60%;
    top: 20%;
    animation: animatePreloader 0.5s infinite linear;
}
@keyframes animatePreloader {
    0% {
        transform: translateX(-50%) translateY(-50%) rotateZ(0deg);
    }
    100% {
        transform: translateX(-50%) translateY(-50%) rotateZ(360deg);
    }
}


@media only screen  and (min-width:1024px) {
.footer{position: absolute;bottom:10px;left: 0;right: 0; }

}

@media only screen  and (max-width:1024px) {

.content{position: absolute; height: 920px;width: 100%; background: url(../images/bg_mid.jpg) center top  no-repeat;}
.round-box{transform: scale(0.90); padding-top:30px;}
.lady_box{margin:0 auto;}

}
@media only screen  and (max-width:900px) {
.lady_box{width: 94%;}
ul.lady_list li{margin: 5px 1.1%;    width: 14%;height: auto;}
}

@media only screen  and (max-width:700px) {
/*body{  background: url(../images/bg_phone_1.jpg) center top  no-repeat; }*/
.content{position: absolute; height: 100%;width: 100%; background: unset;}
.lady_box{width:80%;max-width: 440px;}
ul.lady_list li{margin: 5px 2%;    width: 45%;height: auto;}
.m_bg{display: block;}
.round-box{transform: scale(1);overflow: hidden;position: relative;height: 640px;margin-top:320px; }
.round-border{position: absolute;left: 50%;margin-left: -320px;top: 0;}
}

@media only screen  and (max-width:420px) {
html{font-size: 15px;}
ul.lady_list li{max-height: 200px;}
}

@media only screen  and (max-width:380px) {
.round-border{transform: scale(0.95);}
.title img{max-width: 320px;}
ul.lady_list li{max-height: 180px;}
}

@media only screen and (max-width:331px) {
	.round-border{transform: scale(0.90);}
.form-label,.form-con{width: 100%;float: none;}
.reg_area{max-width: 300px;}
.form-label{padding-bottom: 6px;}
.lady_box {width: 90%;}
.TabbedContent{padding: 10px 0 20px;}
.logo{ margin: 50px auto 20px; }
}
@media (orientation: landscape) {
  .intsva{height: auto;    white-space: normal; }
}

@media (max-width: 600px) and (orientation: landscape) {
html{font-size: 15px;}
}


