seemore-web/activity/css/newYear2019.less

398 lines
7.9 KiB
Plaintext

button:focus {
outline: 0;
}
input:focus {
outline: 0;
}
body {
.bg_snow {
background: url("../img/snow.png") repeat-y;
background-size: 100%;
background-color: rgb(255, 120, 109);
padding-bottom: 20px;
}
}
.img_title {
width: 60%;
margin: 0 auto;
margin-bottom: 10px;
}
.activeIntro {
color: #fff;
font-size: 12px;
text-align: center;
//.content{
// width: 80%;
//}
.phone_box {
background: url("../img/phone_box.png") no-repeat;
height: 412px;
background-size: 100%;
position: relative;
.phone_head {
background: url("../img/phone_box_head.png") no-repeat;
background-size: 100%;
position: absolute;
top: 0;
left: 0;
height: 23px;
width: 100%;
z-index: 1;
}
.phone_body {
background: url("../img/phone_box_body1.png") no-repeat;
background-size: cover;
//height: 100%;
height: 386px;
width: 180px;
position: absolute;
left: 14px;
top: 11px;
transition: all ease 1s;
z-index: 0;
border-radius: 15px;
}
}
.mask {
width: 35px;
height: 23px;
display: inline-block;
background: url("../img/mask.png") no-repeat;
background-size: 100%;
margin-top: 10px;
margin-bottom: 5px;
}
.gift {
width: 31px;
height: 31px;
display: inline-block;
background: url("../img/gift.png") no-repeat;
background-size: 100%;
margin-bottom: 5px;
margin-top: 20px;
}
.icon_alert {
width: 15px;
height: 17px;
display: inline-block;
background: url("../img/alert.png") no-repeat;
background-size: 100%;
vertical-align: bottom;
margin-right: 10px;
}
}
img {
width: 100%;
}
.phone_layout {
width: 60%;
margin: 15px auto;
}
.option {
background: #fffdfd;
border-radius: 15px;
margin-bottom: 40px;
}
.register {
.title {
margin-top: 20px;
margin-bottom: 20px;
img {
width: 45%;
}
}
.sub_title {
margin-top: 15px;
font-size: 15px;
color: #ffffff;
}
.form {
border-radius: 15px;
background-color: #fff4f6;
padding: 35px 20px;
position: relative;
.tip {
color: rgba(251, 98, 103, 0.8);
margin-bottom: 30px;
padding-left: 10px;
i {
position: absolute;
left: 20px;
}
}
.privacy {
font-size: 12px;
margin-top: 5px;
margin-bottom: 5px;
label {
color: rgb(179, 179, 179);
font-weight: normal;
}
a {
color: rgb(0, 126, 244);
//text-underline-style: dash;
text-decoration: underline;
}
}
.input-group {
display: inline-block;
width: 100%;
.input {
border-radius: 20px;
border: 0;
height: 40px;
padding-left: 15px;
margin-bottom: 15px;
float: left;
}
.input:last-child {
margin-bottom: 0;
}
.input-full {
width: 100%;
}
.input-half {
width: 60%;
}
.btn_code {
border: 0;
height: 40px;
width: 35%;
float: right;
color: #ffffff;
background: #a1a1a1;
border-radius: 45px;
opacity: 0.99;
}
.on {
background-image: linear-gradient(-45deg,
#ff6f5f 1%,
#fe6a61 28%,
#fc6463 56%,
#f7506a 100%),
linear-gradient(
#fe6e62,
#fe6e62);
background-blend-mode: normal,
normal;
}
.off {
background: #a1a1a1;
}
}
.errText {
color: rgb(255, 0, 0);
height: 20px;
//padding-top: 5px;
}
input[type=checkbox] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
position: relative;
display: inline-block;
vertical-align: text-bottom;
width: 15px;
height: 15px;
outline: none;
cursor: pointer;
background: url("../../img/invite-uncheck.png") no-repeat;
background-size: 100%;
margin-right: 5px;
}
input[type=checkbox]:after {
content: '';
position: absolute;
width: 15px;
height: 15px;
display: block;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto;
background: url("../../img/invite-checked.png") no-repeat;
background-size: 100%;
-webkit-transform: scale(0);
-moz-transform: scale(0);
transform: scale(0);
-webkit-transition: all ease-in-out 300ms;
-moz-transition: all ease-in-out 300ms;
transition: all ease-in-out 300ms;
-webkit-tap-highlight-color: transparent;
}
input[type=checkbox]:checked:after {
-webkit-transform: scale(1);
-moz-transform: scale(1);
transform: scale(1);
}
}
.btnRegister {
border: 0;
background-image: linear-gradient(-45deg,
#ff6f5f 1%,
#fe6a61 28%,
#fc6463 56%,
#f7506a 100%),
linear-gradient(
#fe6e62,
#fe6e62);
box-shadow: 0 16px 10px -10px rgba(254, 106, 97, .35);
border-radius: 23px;
height: 45px;
color: #fff;
width: 100%;
font-size: 16px;
//margin-top: 20px;
//margin-bottom: 60px;
}
.register_off {
background: url("../../mobile/generalize/img/10.png") no-repeat;
background-size: 100%;
}
.recommend {
color: rgba(251, 98, 103, 0.8);
margin-top: 15px;
}
}
.statement {
text-align: center;
color: rgba(255, 255, 255, 0.8);
padding: 15px;
}
.dialog {
background: rgba(0, 0, 0, 0.25);
width: 100%;
position: fixed;
height: 100%;
left: 0;
top: 0;
z-index: 1;
display: none;
.dialog_box {
//width: 80%;
height: 180px;
background-color: #fff;
box-shadow: 0 0 44px 2px rgba(0, 0, 0, 0.17);
border-radius: 15px;
position: absolute;
left: 10%;
right: 10%;
top: 25%;
padding: 30px 32px;
text-align: center;
display: inline-block;
box-sizing: content-box;
color: rgb(102, 102, 102);
.dialog_title {
span {
font-size: 18px;
color: #333333;
padding-left: 15px;
padding-right: 15px;
}
}
.dialog_over_msg {
margin: 60px 50px;
}
.dialog_content {
font-size: 14px;
margin-bottom: 5px;
#text_phone {
color: rgb(254, 110, 98);
}
}
.registerTip {
color: rgba(251, 98, 103, 0.8) !important;
font-size: 12px;
margin-top: 20px;
margin-bottom: 20px;
}
.dialog_btn {
.btn_ok {
width: 100%;
background-image: linear-gradient(-45deg,
#ff6f5f 1%,
#fe6a61 28%,
#fc6463 56%,
#f7506a 100%),
linear-gradient(
#fe6e62,
#fe6e62);
border: 0;
box-shadow: 0 16px 10px -10px rgba(254, 106, 97, .35);
border-radius: 23px;
height: 45px;
color: #fff;
font-size: 16px;
}
}
}
}
.useAppBrowser {
background: rgba(0, 0, 0, 0.8);
width: 100%;
position: fixed;
height: 100%;
left: 0;
top: 0;
z-index: 1;
display: none;
.arrow {
background: url("../../mobile/generalize/img/arrow.png") no-repeat;
background-position: 90%;
//width: 100%;
//height: 100%;
height: 100px;
background-size: contain;
margin-top: 30px;
}
.btn_border {
//border-radius: 45px;
//border: 2px solid #fff;
color: #fff;
text-align: center;
padding: 25px;
font-size: 18px;
}
}
.bg_white {
background: #fff !important;
}
@media screen and ( min-width: 600px ) {
.bg_snow {
width: 375px;
margin: 0 auto;
}
.container {
width: 375px !important;
}
.dialog .dialog_box{
width: 300px;
margin: 0 auto;
}
.btn_ok {
height: 46px !important;
font-size: 14px !important;
padding-bottom: 5px !important;
}
//
//.btn_regist {
// height: 46px !important;
// padding-top: 9px !important;
//}
}