iamberry-app-international/iamberry-common-parent/iamberry-wechat-web/target/iamberry-wechat-web-1.0.0/wechat/test/css/newapp.css

/*鏈粡鎺堟潈涓嶅彲浣滀负鍟嗕笟鐢ㄩ�锛屼綔鑰呮紗瀵掑В鑱旂郴QQ522169706*/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
body, button, input, select, textarea { font-size:14px; }
h1, h2, h3, h4, h5, h6{ font-size:100%; }
address, cite, dfn, em, var { font-style:normal; }
code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
small{ font-size:12px; }
ul{ list-style:none; }
a { text-decoration:none; }
a:hover { text-decoration:underline; }
sup { vertical-align:text-top; }
sub{ vertical-align:text-bottom; }
legend { color:#000; }
fieldset, img { border:0; }
button, input, select, textarea { font-size:100%; }
table { border-collapse:collapse; border-spacing:0;width: 100%;height: 100%;text-align: center;}
body div{-webkit-backface-visibility: hidden;-webkit-perspective:1000;}
html{height: 100%;}
body{height: 100%;background: #f0f0f0;}
body>a:first-child{display: none;}
.cl-red{color: #d90049;}
.cl-gray{color: #525252;}
.loading-bg{width: 100%;height: 100%;background-color:#ccc;position: fixed;left: 0;top: 0;z-index: 999;color: #000;}
.loading-bg:after{content: '';position: absolute;left: 50%;top: 55%;-webkit-transform: translateX(-45%);transform: translateX(-45%);}
.loading {
    width: 3px; height:3px;
    border-radius: 100%;
    box-shadow: 0 -10px 0 1px currentColor,           /* top, 1px expand */
                10px 0px currentColor,                /* right */
                0 10px currentColor,                  /* bottom */
                -10px 0 currentColor,                 /* left */

                -7px -7px 0 .5px currentColor,        /* left-top, 0.5px expand */
                7px -7px 0 1.5px currentColor,        /* right-top, 1.5px expand */
                7px 7px currentColor,                 /* right-bottom */
                -7px 7px currentColor;                /* left-bottom */
	-webkit-animation: loading 1s step-start infinite;
	animation: loading 1s step-start infinite;
	/*center*/
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	margin: auto;
}
.deg {-webkit-animation: music 2s linear 0s infinite;}
.music {position: absolute;bottom: 15px;right: 15px;width: 35px;height: 35px;background: url(http://h5.iamberry.com/iamberry/wechat/test/images/music.png) center center no-repeat;z-index: 98;background-size:35px;}
.music_btn{position: absolute;bottom:16px;right: 1px;width: 50px;height: 50px;background: url(http://h5.iamberry.com/iamberry/wechat/test/images/music.gif) center center no-repeat; background-size: 60px 60px;z-index: 98;}
@-webkit-keyframes music {from {-webkit-transform: rotate(360deg);}to {-webkit-transform: rotate(0deg);}}
.logo {display: block;width: 30%;position: absolute;left:8px;top:8px;}
.logo1 {display: block;width: 40%;position: absolute;left:8px;top:8px;}
.view1_img1{width: 100%;position: absolute;left: 0;top: 80%;}
.bg_3 h1,.bg_4 h1,.bg_5 h1{font-size: 22px;}
.bg_6 .six_2{margin: 10px 0;}
.bg_6 .six_2 img{width: 50%;}
.share-2wm{margin: 15px 0;}
.share-2wm img{width: 50%;}
.btn_box{position: relative;margin: 5px 0;}
.btn_box .btn_dy{position: absolute;width: 50%;left: 25%;top: 0;}
.btn_box  .hand{position: absolute;width: 15%;right:20%;top: 0;}
.page h5{font-size: 14px;font-weight: 100;}
.ul_qes{padding: 5px;}
.ul_qes li{font-size: 13px;padding: 2px 0;}
.bg_1,.bg_2,.bg_3,.bg_4,.bg_5,.bg_6,.bg_7,.bg_8,.bg_9,.bg_10,.bg_11,.bg_12,.bg_13,.bg_14,.bg_15,.bg_16,.bg_17{overflow: hidden;height: 100%;width: 100%;position: relative;}
.bg_1{background:url(http://h5.iamberry.com/iamberry/wechat/test/images/bg-1.jpg) top center no-repeat;background-size:100% 100%;}
.bg_2{background:url(http://h5.iamberry.com/iamberry/wechat/test/images/bg-2.jpg) top center no-repeat;background-size:100% 100%;}
.bg_3{background:url(http://h5.iamberry.com/iamberry/wechat/test/images/bg-3.jpg) top center no-repeat;background-size:100% 100%;}
.bg_4{background:url(http://h5.iamberry.com/iamberry/wechat/test/images/bg-4.jpg) top center no-repeat;background-size:100% 100%;}
.bg_5{background:url(http://h5.iamberry.com/iamberry/wechat/test/images/bg-5.jpg) top center no-repeat;background-size:100% 100%;}
.bg_6{background:url(http://h5.iamberry.com/iamberry/wechat/test/images/bg-6.jpg) top center no-repeat;background-size:100% 100%;}
.bg_7{background:#fbdedf;}
.bg_8{background:#fbdedf;}
.bg_8 input{border: 0;border-bottom: 1px solid #000;background-color: transparent;outline:none;width:90px;border-radius: 0;}
input[type=radio]{-webkit-appearance: none;width: 12px;height:12px;border: 1px solid #ccc;border-radius: 50%;margin-right: .5em;}
input[type=radio]:checked{border: 1px solid #d90049;background-color: #d90049;border-radius: 50%;}
.top_title{width: 100%;position: relative;}
.top_title img{width: 100%;}
.left1,.right1{display: inline-block;width: 48%;}
.left1-2{display: inline-block;width: 30%;padding-right: 15%;}
.right1-2{display: inline-block;width: 30%;padding-left: 20%;}
.one_1{position: absolute;left: 12.5%;width: 75%;top:50%;-webkit-transform: translateY(-50%);}
.two_1{position: absolute;left: 15%;width: 70%;top:50%;-webkit-transform: translateY(-50%);}
.bg_2 .two_2{text-align: center;position:absolute;width: 100%;left: 0;bottom: 50%;}
.bg_2 .two_2 img{width: 25%;margin:0 5px;}
.btn_submit{position: absolute;bottom:10px;width:40%;left: 30%;padding: 7px 15px;background-color: #c9c9ca;border: 0;border-radius: 25px;color: #fff;}
.dalog{position: fixed;left: 0;top: 0;width: 100%;height: 100%;background:rgba(0,0,0,.7);background-size: 80%;z-index: 100;display: none;}
.dalog ul{position: absolute;left:5%;top: 30%;width: 100%;width: 80%;background: #fff;border-radius: 5px;padding: 20px 5%;}
.dalog ul li{margin: 15px 0;}
.dalog ul li input{border-radius: 3px;padding: 8px;border: 1px solid #DEDEDE;}
.btn_addmsg{text-align: center;position: absolute;left: 50%;top: 65%;width: 100px;margin-left: -65px; padding: 8px 15px;background: #D90049;border-radius: 25px;color: #fff;}
.bg_1 img,.bg_2 img,.bg_3 img,.bg_4 img,.bg_5 img,.bg_6 img,.bg_7 img,.bg_8 img,.bg_9 img,.bg_10 img,.bg_11 img,.bg_12 img,.bg_13 img,.bg_14 img,.bg_15 img,.bg_16 img,.bg_17 img{width:100%;}
.move {
	display: block;
	width: 2.2em;
	height: 2.2em;
	position: absolute;
	bottom: 8px;
	left: 50%;
	border:0;
	border-radius: 50%;
	background: url(http://h5.iamberry.com/iamberry/wechat/test/images/up.png) center center no-repeat;
	background-size:2em;
	z-index: 99;
	opacity: .8;
	-webkit-animation: arrow 1s ease;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-delay: .5s;
	-webkit-animation: arrow 1.5s infinite ease-in-out
}
@-webkit-keyframes arrow {
	0% {
		opacity: 0;
		-webkit-transform: translate(-50%, 4px)
	}
	50% {
		opacity: 1;
		-webkit-transform: translate(-50%, -5px)
	}
	100% {
		opacity: 0;
		-webkit-transform: translate(-50%, -12px)
	}
}
.handmove{-webkit-animation: handmove 1.2s ease-in 0s;}
@-webkit-keyframes handmove {0% {-webkit-transform:translateX(50%) translateY(150%);}30% {-webkit-transform:translateX(50%) translateY(150%);}100% {-webkit-transform:translateX(0) translateY(0);}}
.leftin{-webkit-animation: left_in 9.2s ease-in 0s;}
@-webkit-keyframes left_in {0% {left: -100%;}70% {left: 4%;}80% {left: -4%;}90% {left: 2%;}100% {left: 0;}}
.rightin{-webkit-animation: right_in 1.2s ease-in 0s;}
@-webkit-keyframes right_in {0% {-webkit-transform: translateX(100%);}70% {-webkit-transform: translateX(-5%);}80% {-webkit-transform: translateX(5%);}90% {-webkit-transform: translateX(-3%);}100% {-webkit-transform: translateX(0);}}
.leftin_1{-webkit-animation: leftin_1 2s linear 0s;}
@-webkit-keyframes leftin_1 {0% {-webkit-transform: translateX(-150%);}50% {-webkit-transform: translateX(8%);}55% {-webkit-transform: translateX(0);}}
.leftin_2{-webkit-animation: leftin_2 2s linear 0s;}
@-webkit-keyframes leftin_2 {0% {-webkit-transform: translateX(-150%);}60% {-webkit-transform: translateX(8%);}65% {-webkit-transform: translateX(0);}}
.leftin_3{-webkit-animation: leftin_3 2s linear 0s;}
@-webkit-keyframes leftin_3 {0% {-webkit-transform: translateX(-150%);}70% {-webkit-transform: translateX(8%);}75% {-webkit-transform: translateX(0);}}
.leftin_4{-webkit-animation: leftin_4 2s linear 0s;}
@-webkit-keyframes leftin_4 {0% {-webkit-transform: translateX(-150%);}80% {-webkit-transform: translateX(8%);}85% {-webkit-transform: translateX(0);}}
.rightin{-webkit-animation: right_in 1.2s linear 0s;}
@-webkit-keyframes right_in {0% {-webkit-transform: translateX(100%);}70% {-webkit-transform: translateX(-8%);}80% {-webkit-transform: translateX(8%);}90% {-webkit-transform: translateX(-5%);}100% {-webkit-transform: translateX(0);}}
.rightin_1{-webkit-animation: rightin_1 2s linear 0s;}
@-webkit-keyframes rightin_1 {0% {-webkit-transform: translateX(150%);}50% {-webkit-transform: translateX(-8%);}60% {-webkit-transform: translateX(0);}}
.rightin_2{-webkit-animation: rightin_2 2.1s linear 0s;}
@-webkit-keyframes rightin_2 {0% {-webkit-transform: translateX(150%);}58% {-webkit-transform: translateX(-8%);}70% {-webkit-transform: translateX(0);}}
.rightin_3{-webkit-animation: rightin_3 2.2s linear 0s;}
@-webkit-keyframes rightin_3 {0% {-webkit-transform: translateX(150%);}66% {-webkit-transform: translateX(-8%);}80% {-webkit-transform: translateX(0);}}
.rightin_4{-webkit-animation: rightin_4 2.3s linear 0s;}
@-webkit-keyframes rightin_4 {0% {-webkit-transform: translateX(150%);}74% {-webkit-transform: translateX(-8%);}90% {-webkit-transform: translateX(0);}}
.rightin_5{-webkit-animation: rightin_5 2.4s linear 0s;}
@-webkit-keyframes rightin_5 {0% {-webkit-transform: translateX(150%);}82% {-webkit-transform: translateX(-8%);}95% {-webkit-transform: translateX(0);}}
.smallbig{-webkit-animation: smallbig 0.9s ease-in 0s;}
@-webkit-keyframes smallbig {0% {-webkit-transform: scale(0);opacity: 0;}100% {-webkit-transform:scale(1);}}
.smallbig1{-webkit-animation: smallbig1 2.5s ease-in 0s;}
@-webkit-keyframes smallbig1 {0% {-webkit-transform: scale(0);opacity: 0;}15% {-webkit-transform:scale(0);opacity: 0;}20% {-webkit-transform:scale(1.1);opacity: 1;}25% {-webkit-transform:scale(.8);opacity: 1;}28% {-webkit-transform:scale(1);opacity: 1;}100% {-webkit-transform:scale(1);opacity: 1;}}
.smallbig2{-webkit-animation: smallbig2 2.5s ease-in 0s;}
@-webkit-keyframes smallbig2 {0% {-webkit-transform: scale(0);opacity: 0;}35% {-webkit-transform:scale(0);opacity: 0;}40% {-webkit-transform:scale(1.1);opacity: 1;}45% {-webkit-transform:scale(.8);opacity: 1;}48% {-webkit-transform:scale(1);opacity: 1;}100% {-webkit-transform:scale(1);opacity: 1;}}
.smallbig3{-webkit-animation: smallbig3 2.5s ease-in 0s;}
@-webkit-keyframes smallbig3 {0% {-webkit-transform: scale(0);opacity: 0;}55% {-webkit-transform:scale(0);opacity: 0;}60% {-webkit-transform:scale(1.1);opacity: 1;}65% {-webkit-transform:scale(.8);opacity: 1;}68% {-webkit-transform:scale(1);opacity: 1;}100% {-webkit-transform:scale(1);opacity: 1;}}
.smallbig4{-webkit-animation: smallbig4 2.5s ease-in 0s;}
@-webkit-keyframes smallbig4 {0% {-webkit-transform: scale(0);opacity: 0;}80% {-webkit-transform:scale(0);opacity: 0;}85% {-webkit-transform:scale(1.1);opacity: 1;}90% {-webkit-transform:scale(.8);opacity: 1;}93% {-webkit-transform:scale(1);opacity: 1;}100% {-webkit-transform:scale(1);}}
/*4-417*2=834*/
@media (device-height:480px) and (min-width:320px) and (-webkit-min-device-pixel-ratio:2){

}