@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap'); body { font-family: 'Poppins', sans-serif; color: black; } p { font-size: 12px; } .language-box{ display: block; width: 124px; height: 40px; line-height: 40px; text-align: center; border: 1px solid #fff; border-radius: 6px; font-size: 16px; font-weight: 400; text-decoration: none; /* color: #ffffff; */ margin-left: 24px; } .btn-primary { background: rgb(237,31,37); background: linear-gradient(90deg, rgba(237,31,37,1) 0%, rgba(254,89,36,1) 100%); border-radius: 5px; border: none; padding-left: 30px !important; padding-right: 30px !important; color: white; } .main-heading { font-size: 60px; font-weight: 700; } .bg-header { color: white; background-image: url(../imgs/header-bg.png); background-repeat: no-repeat; background-size: 100%; /* background-position: bottom; */ } .btn-gradient { background: -webkit-linear-gradient(90deg, rgba(237,31,37,1) 0%, rgba(254,89,36,1) 100%); color: white; border-radius: 5px; border: none; font-size: 30px; padding-left: 80px !important; padding-right: 80px !important; font-weight: 700; padding: 10px; } .btn-gradient:hover { background: -webkit-linear-gradient(90deg, rgba(254,89,36,1) 0%, rgba(237,31,37,1) 100%); color: white; } .text-primary { background: -webkit-linear-gradient(90deg, rgba(237,31,37,1) 0%, rgba(254,89,36,1) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } section { padding-top: 5rem; padding-bottom: 5rem; } .section-bg { background-image: url(../imgs/section-bg.png); background-repeat: no-repeat; } .bg-menu { background-color: #fff; backdrop-filter: blur(10px); } .section-bg-1 { background-image: url(../imgs/section-bg-1.png); background-repeat: no-repeat; background-attachment: fixed; } .section-bg-2 { background-image: url(../imgs/section-bg-2.png); background-repeat: no-repeat; /* background-attachment: fixed; */ background-size: cover; color: white; } .bg-danger { background: -webkit-linear-gradient(90deg, rgba(237,31,37,1) 0%, rgba(254,89,36,1) 100%); color: white; } .btn-secondary { color: white; background-color: #34065c; } .bg-secondary { color: white; background-color: #34065c !important; } .container__image { float: left; } .container__text { display: table-cell; padding-left: 15px; } .followers-section { border-width: 2px; border-style: solid; border-image: linear-gradient(to top, #3A9DD5, #F23025) 1; background-color: #25054D; padding: 15px; } .spring-bg { border-width: 8px; border-style: solid; border-image: linear-gradient(to top, #ffc161, #fffaef) 1; background-color: #25054D; padding: 15px; border-radius: 20px; box-shadow: inset 0px 0px 20px rgba(0,0,0,0.5); } .spring-bg-box { border-width: 8px; border-style: solid; border-image: linear-gradient(to top, #ffbb58, #fffaef) 1; background-color: #fff; padding: 15px; border-radius: 20px; margin: 5px; width: 32%; box-shadow: inset 0px 0px 20px rgba(0,0,0,0.5); display: flex; flex-direction: column; justify-content: center; align-items: center; } .spring-bg-box-red { border-width: 8px; border-style: solid; border-image: linear-gradient(to top, #ffbb58, #fffaef) 1; background-color: red; padding: 15px; border-radius: 20px; margin: 5px; width: 32%; box-shadow: inset 0px 0px 20px rgba(0,0,0,0.5); cursor: pointer; display: flex; flex-direction: column; justify-content: center; align-items: center; } .spring-box-text { background: linear-gradient(to top, #ffbb58 50%, #fff0d2 50%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 70px; font-weight: 700; filter: drop-shadow(4px 4px 2px #00000070); -webkit-text-stroke: 2px #a35500; } .spring-bg-box-red .spring-box-text { background: linear-gradient(to top, #ffbb58 50%, #fff0d2 50%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 40px; font-weight: 700; filter: drop-shadow(4px 4px 2px #00000070); -webkit-text-stroke: 2px #a35500; } .spring-bg-box-red p.spring-box-text1 { margin: 0; background: linear-gradient(to top, #ffbb58 50%, #fff0d2 50%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 20px; font-weight: 700; filter: drop-shadow(4px 4px 2px #00000070); /* -webkit-text-stroke: 2px #a35500; */ } .spring-box-text-s{ font-size: 40px; } .title { line-height: 1.5em; font-weight: bold; } .caption { font-size: 0.8em; } .step-bg { width: 300px; height: 300px; border: double 10px transparent; border-radius: 50%; background-image: linear-gradient(white, white), radial-gradient(circle at top left, #f00,#3020ff); background-origin: border-box; background-clip: content-box, border-box; display: inline-block; box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); text-align: center; display: flex; flex-direction: column; justify-content: center; } .step-bg h4{ padding: 1rem; } .main-heading-4 { border-width: 2px; border-style: solid; border-image: linear-gradient(to top, rgb(58, 157, 213), rgb(242, 48, 37)) 1 / 1 / 0 stretch; padding: 10px; backdrop-filter: blur(8px); font-size: 36px; font-weight: bolder; } .bg-footer { color: white; background-image: url(../imgs/footer-bg.png); background-repeat: no-repeat; background-position: bottom; background-size: 100%; } .el-carousel.el-carousel--horizontal{ width: 550px; } .Avatar{ width: 100%; position: absolute; top: -45px; left: 0; display: flex; justify-content: center; z-index: 9; } .Avatar img{ width: 80px; background: #fff; border-radius: 80px; } .my-winner-dec{ background: linear-gradient(to top, #ffbb58 50%, #fff0d2 50%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 700; filter: drop-shadow(4px 4px 2px #00000070); /* -webkit-text-stroke: 2px #a35500; */ font-size: 2rem; width: 100%; position: absolute; top: 200px; left: 0; text-align: center; } .my-winner-dec1{ background: linear-gradient(to top, #ffbb58 50%, #fff0d2 50%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: 700; filter: drop-shadow(4px 4px 2px #00000070); /* -webkit-text-stroke: 2px #a35500; */ font-size: 2rem; width: 100%; position: absolute; top: 140px; left: 0; text-align: center; } /* 抽奖 */ .w-turntable-content { display: flex; flex-wrap: wrap; /* width: 288px; height: 288px; */ background-color: #fff; margin: 20px auto; } .w-turntable-content .turntable-item { /* width: 92px; height: 92px; */ /* border-radius: 16px; background-size: 100%; */ /* margin-right: 6px; margin-bottom: 6px; */ /* padding: 12px 16px 0; */ display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; /* background-color: rgba(250, 110, 90); */ } .turntable-item:nth-last-child(1), .turntable-item:nth-last-child(2), .turntable-item:nth-last-child(3) { margin-bottom: 0; } .turntable-item:nth-child(3n) { margin-right: 0; } .turntable-item .item-img { /* width: 60px; height: 60px; */ border-radius: 8px; } .turntable-item .name { /* margin-bottom: 8px; */ /* font-size: 12px; */ /* font-weight: 400; color: #835023; line-height: 18px; */ /* width: 92px; */ text-align: center; } .w-turntable-content .turntable-btn { /* width: 92px; height: 92px; */ margin-right: 6px; } .turntable-btn .item-btn-img { width: 100%; height: 100%; border-radius: 16px } /* // 抽奖活动开始时的遮罩层 */ .w-turntable-content .start-activity-bg { /* width: 92px; height: 92px; */ width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.3); border-radius: 16px; } .el-message-box__message p{ font-size: 16px; font-weight: bold; } .el-button--mini, .el-button--small{ font-size: 16px; } .banner_img{ width: 750px; margin-top: 50px; margin-left: 80px; } .banner_box .main-heading{ font-size: 80px; } .el-dialog.crm-signup{ width: 680px; border-radius: 10px; } .banner-signup{ padding: 25px 50px; color: #333; position: relative; font-family: Poppins, sans-serif; } .banner-signup .close{ width: 40px; height: 40px; border-radius: 30px; background-color: #F02925; cursor: pointer; display: flex; justify-content: center; align-items: center; color: #fff; position: absolute; top: -40px; right: 0; } .banner-signup .title{ font-size: 18px; margin-bottom: 50px; font-family: Poppins, sans-serif; display: flex; flex-direction: column; justify-content: center; align-items: center; } .banner-signup .title .img-responsive{ margin-bottom: 40px; } .banner-signup .title .title2{ font-size: 26px; font-weight: 900; } .banner-signup .el-input__inner{ width: 100%; height: 60px; font-size: 17px; background-color: #F8F8F8; border-radius: 6px; border-color: #B1B1B1; color: #434242; background-color: transparent; font-weight: 600; } .banner-signup .el-input__inner::placeholder{/*Firefox,Chrome,Opera*/ color:#434242; } .banner-signup .el-input__inner:-ms-input-placeholder{/*InternetExplorer10-11*/ color:#434242; } .banner-signup .el-input__inner::-ms-input-placeholder{/*MicrosoftEdge*/ color:#434242; } /* .el-input__inner { border: none; border-bottom: 1px solid; border-radius: 0; border-color: #979797; color: #e4e4e4; background-color: transparent; } */ .banner-signup .el-select .el-input__inner { padding-left: 40px; } i.icondingwei { position: absolute; top: 10px; left: 12px; color: #F02925; font-weight: 600; } .banner-signup .el-input__prefix, .el-input__suffix{ color: #F02925; font-weight: 600; } .banner-signup .el-input--prefix .el-input__inner { padding-left: 40px; } .banner-signup .el-input__prefix{ padding-left: 8px; top: 2px; } .banner-signup .el-select{ width: 100%; } .banner-signup .el-col{ padding: 0; } .banner-signup .getCode{ display: inline-block; width: 100%; line-height: 60px; text-align: center; background-color: #191B28; border: 1px solid #e4e4e4; cursor: pointer; color: #e4e4e4; border-radius: 6px; font-size: 17px; padding: 0 !important; } .pwd { text-align: left; padding-left: 20px; margin: 0; margin-left: 10px; font-size: 15px; } .pwd li { list-style-type: disc; /*height: 20px;*/ line-height: 20px; color: #979797; } .pwd .fit { color: #EC1920; } .banner-signup .agree{ font-size: 16px; color: #434242; } .banner-signup .agree_title{ word-break: keep-all; } .banner-signup .el-checkbox__inner::after{ height: 10px; left: 7px; position: absolute; top: 2px; } .banner-signup .el-checkbox__inner{ width: 20px; height: 20px; } .banner-signup .el-checkbox__input.is-checked .el-checkbox__inner{ background-color: #EC1920; border-color: #EC1920; } .banner-signup .el-checkbox__inner:hover { border-color: #EC1920; } .banner-signup .el-checkbox__input.is-focus .el-checkbox__inner{ border-color: #EC1920; } .banner-signup .sign-btn.btn-gradient{ width: 100%; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; word-break: break-word; padding-left: 0px !important; padding-right: 0px !important; } .banner-signup-btnBox{ display: flex; } @media screen and (max-width: 768px) { .bg-header { background-size: cover; } .main-heading { font-size: 30px; font-weight: 700; } .spring-box-text{ font-size: 20px; } .spring-bg-box{ width: 30%; } .spring-bg-box-red .spring-box-text{ font-size: 12px; -webkit-text-stroke: 0px #a35500; } .spring-bg-box-red p.spring-box-text1{ font-size: 12px; } .spring-box-text-s{ font-size: 12px; -webkit-text-stroke: 0px #a35500; } .spring-box-text{ -webkit-text-stroke: 1px #a35500; } .my-winner-dec{ top: 170px; font-size: 1rem; } .my-winner-dec1{ top: 110px; } .btn-gradient{ display: block; } .navbar-toggler-icon{ background-color: rgba(237,31,37,1); } .step-bg-con{ display: flex; justify-content: center; } .table.table-striped{ font-size: 16px; } .bg-footer{ background-size: cover; } .btn.btn-gradient.mt-5.w-25{ width: 80% !important; } .banner_img{ width: 562px; margin-top: 30px; margin-left: 58px; } .banner_box{ overflow: hidden; } .banner_box .main-heading{ font-size: 30px; } .el-dialog.crm-signup { width: 95%; border-radius: 10px; } .banner-signup { padding: 25px 0; word-break: break-word; } .banner-signup .text-primary.fw-bolder{ font-size: 25px; } .banner-signup .title .title2 { font-size: 20px; } .pwd { word-break: break-word; } .banner-signup-btnBox{ display: flex; flex-wrap: wrap; } .banner-signup .sign-btn{ margin-left: 0 !important; margin-right: 0 !important; } }