.artboard-bounties { height: 100%; background: #f6f6f6 url(../img/artboard-bg.jpg) no-repeat center top; background-size: 100%; } a { text-decoration: none; } .artboard-banner { width: 100%; height: 362px; } .artboard-banner .container .artboard-banner-wrap { padding-top: 120px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count { float: left; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count > div { float: left; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count > div .artboard-banner-tit { font-size: 18px; margin: 0; font-family: helvetica, "microsoft yahei"; text-align: center; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count > div .artboard-banner-num { font-size: 72px; text-align: center; font-weight: normal; font-family: helvetica, "microsoft yahei"; } #myTargetElement-bugs{width: 300px} #myTargetElement-money{width: 380px;} .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-consult { margin-right: 45px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money { margin-right: 45px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money .artboard-banner-num { overflow: hidden; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money .artboard-banner-num i { font-style: normal; float: left; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money .artboard-banner-num span { font-size: 20px; line-height: 155px; float: left; font-family: arial; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY { float: left; background: url(../img/artboard-bg-blue.png) no-repeat left top; width: 342px; height: 117px; padding-left: 76px; padding-top: 10px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutL { overflow: hidden; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutL > span { float: left; margin-bottom: 15px; width: 100px; line-height: 35px; margin-right: 30px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutL a { float: left; display: inline-block; text-align: center; width: 123px; height: 35px; border-radius: 2px; border: solid 1px #339aff; color: #339aff; line-height: 35px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutL a:hover { text-decoration: none; color: #fff; background: #339aff; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutL a:focus { text-decoration: none; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR { padding-top: 10px; position: relative; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR > span { float: left; margin-bottom: 15px; width: 100px; line-height: 35px; margin-right: 30px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR a { float: left; display: inline-block; text-align: center; width: 123px; height: 35px; border-radius: 2px; border: solid 1px #339aff; color: #339aff; line-height: 35px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR a:hover { text-decoration: none; color: #fff; background: #339aff; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR a:focus { text-decoration: none; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR a:first-child { margin-bottom: 15px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs { position: absolute; top: 58px; left: 23%; width: 264px; height: 171px; background-color: #ffffff; border: solid 1px #339aff; display: none; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel { padding: 18px; position: relative; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel .artboard-banner-rel-abs { position: absolute; left: 50%; top: -17px; padding: 0; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel .artboard-banner-rel-abs img { margin-left: -50%; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel .artboard-banner-aboutR-vip { font-size: 16px; color: #4a4a4a; letter-spacing: 1.5px; margin-bottom: 17px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel > div { color: #339aff; background-position: left top; padding-left: 30px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel > div span { display: block; text-align: left; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel .artboard-banner-aboutR-ph { background: url(../img/artboard-icon-account.png) no-repeat; margin-bottom: 10px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel .artboard-banner-aboutR-em { background: url(../img/artboard-icon-email.png) no-repeat; margin-bottom: 25px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR .artboard-banner-aboutR-abs .artboard-banner-aboutR-rel .artboard-banner-aboutR-tim { font-size: 12px; color: #9b9b9b; } .artboard-classify { width: 100%; height: 70px; background-color: rgba(74, 73, 74, 0.1); } .artboard-classify .artboard-classify-header { text-align: center; margin-bottom: 62px; } .artboard-classify .artboard-classify-header .artboard-classify-header-hover { text-decoration: none; color: #339aff; background-image: linear-gradient(to bottom, #f4f4f4, #ffffff); } .artboard-classify .artboard-classify-header a { display: inline-block; width: 96px; height: 70px; line-height: 70px; font-size: 16px; font-family: "microsoft yahei"; } .artboard-classify .artboard-classify-header a:hover { text-decoration: none; color: #339aff; } .artboard-classify .artboard-classify-main { overflow: hidden; margin-bottom: 38px; } .artboard-classify .artboard-classify-main .artboard-classify-project { padding: 20px; border: 1px solid #d8d8d8; border-radius: 2px; width: 32%; background: #fff; float: left; position: relative; font-family: "microsoft yahei"; transition: all .5s; } .artboard-classify .artboard-classify-main .src-classify-pro{margin-bottom: 39px;} .artboard-classify .artboard-classify-main .artboard-src-enter{padding: 0;height: 405px;border: 0;cursor: pointer;} .artboard-classify .artboard-classify-main .artboard-src-enter img{width: 100%;height: 406px;} .artboard-classify .artboard-classify-main .artboard-src-enter h2{position: absolute; top: 137px;text-align: center;width: 100%;color: #fff;font-size: 48px;font-weight: bold;} .artboard-classify .artboard-classify-main .artboard-src-enter .detail{position: absolute;top: 292px;width: 100%;text-align: center;border: 0;font-size: 18px;color: #fff;} .artboard-classify .artboard-classify-main .artboard-src-enter .position-detail{position:absolute;top: 0;width: 100%;height: 100%;background: #2D557C; opacity: 0;} .artboard-classify .artboard-classify-main .artboard-src-enter .position-detail p{position: absolute;padding:0 9%;top: 150px;font-size: 14px;font-weight: normal;font-style: normal;font-stretch: normal;line-height: 2.07;letter-spacing: normal;color: #ffffff;border: 0;} .artboard-classify .artboard-classify-main .artboard-src-enter:hover .position-detail{opacity: 1;} .artboard-classify .artboard-classify-main .artboard-src-enter:hover .position-detail1{background:url(/static/bounties/img/src-inter2.png);} .artboard-classify .artboard-classify-main .artboard-classify-project:hover{border: 1px solid #4db8ff;} .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-hot { position: absolute; right: 0; top: 0; } .artboard-classify .artboard-classify-main .artboard-src-enter:hover {border: 0;} .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-nom { position: absolute; width: 90px; height: 31px; left: 0; top: 30px; font-size: 16px; color: #ffffff; text-align: center; line-height: 31px; border-radius: 2px; background-color: rgba(59, 125, 200, 0.7); } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-pic img { width: 100%;height: 216px} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-pic{max-height: 216px} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-tel{width:66%;margin: 10px auto 8px;color: #6c6c6c;font-size: 14px;white-space: nowrap;background: url(../img/tel.png) no-repeat left center;padding-left: 30px;} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-mail{width:66%;margin: 0 auto 13px;color: #6c6c6c;font-size: 14px;white-space: nowrap;background: url(../img/email.png) no-repeat left center;padding-left: 30px;} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-border{height: 1px;opacity: 0.54;border-top: solid 1px #cfd7de;margin-bottom: 15px;} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-time{margin-bottom: 42px;font-size: 12px;color: #9b9b9b;text-align: center;} .artboard-classify .artboard-classify-main .artboard-classify-project h4 { color: #4a4a4a; font-size: 16px; } .integral-hall {float: right;z-index: 10;} .artboard-classify .artboard-classify-main .artboard-classify-project p { color: #9b9b9b; font-size: 14px; min-height: 56px; padding-bottom: 15px; min-height: 56px; border-bottom: solid 1px #f3f3f3; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail { position: relative; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-time { font-size: 14px; color: #4a4a4a; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level { overflow: hidden; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level span { float: left; height: 23px; line-height: 23px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level span:first-child { margin-right: 10px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .artboard-classify-detail-star { width: 80px; background: url(../img/grades.png) no-repeat; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades8 { background-position: 0 0; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades7 { background-position: 0 -23px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades6 { background-position: 0 -46px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades5 { background-position: 0 -69px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades4 { background-position: 0 -92px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades3 { background-position: 0 -115px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades2 { background-position: 0 -138px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level .grades1 { background-position: 0 -161px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-btn { position: absolute; text-align: center; line-height: 37px; width: 76px; height: 40px; font-family: "microsoft yahei"; font-size: 16px; color: #339aff; right: 0; top: 0; border: solid 1px #339aff; border-radius: 2px; transition: all .5s; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .btn-success { color: #22B573; border: solid 1px #22B573; background: none; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .btn-primary { color: #339AFF; border: solid 1px #339AFF; background: none; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .btn-over { color: #fff; border: solid 1px #D8D8D8; background-color: #D8D8D8; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-btn:hover { text-decoration: none; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .btn-success:hover{background: #22B573; color: #fff;} .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .btn-primary:hover{background: #339AFF; color: #fff;} .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-btn:focus { text-decoration: none; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail a:hover, .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail a:focus { text-decoration: none; } .artboard-classify .artboard-classify-main > div:nth-child(3n-1) { margin: 0 2%;} .artboard-classify .artboard-classify-main > div { margin-bottom: 30px; } @media (max-width: 1200px) { .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-consult { margin-right: 25px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money { margin-right: 25px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money .artboard-banner-num span { line-height: 109px; } .artboard-classify .artboard-classify-main .artboard-src-enter img{height: 397px;} .artboard-banner .container .artboard-banner-wrap .artboard-banner-count > div .artboard-banner-num { font-size: 60px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY { width: 300px; padding-left: 20px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutL { margin-right: 15px; } .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-tel{width: 50%;} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-mail{width: 50%;} #myTargetElement-bugs{width: 240px} #myTargetElement-money{width: 270px;} .artboard-classify .artboard-classify-main .artboard-classify-project p { font-size: 12px; } .artboard-classify .artboard-classify-main .artboard-classify-project h4 { font-size: 14px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-time { font-size: 12px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-btn { line-height: 32px; width: 68px; height: 33px; font-size: 14px; } .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-detail .artboard-classify-detail-level span { font-size: 12px; }} @media (max-width: 1024px) { .artboard-bounties { background: url(../img/bg-768.jpg) no-repeat center top; background-size: 100%; } #myTargetElement-bugs{width: 290px} #myTargetElement-money{width: 360px;} .artboard-banner { height: 462px; } .artboard-classify .artboard-classify-main .artboard-src-enter{height: 398px;} .artboard-banner .container .artboard-banner-wrap .artboard-banner-count { float: none; overflow: hidden; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money { float: right; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count > div .artboard-banner-num { font-size: 80px; } .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-tel{width: 70%;} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-mail{width: 70%;} .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY { float: none; background: url(../img/bg-blue-768.png) left top; width: 100%; padding-top: 20px; height: 74px; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutL { float: left; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY .artboard-banner-aboutR { float: right; padding-top: 0; margin-right: 10%; } .artboard-classify .artboard-classify-main .artboard-classify-project { width: 48%; margin-bottom: 30px; } .artboard-classify .artboard-classify-main > div:nth-child(3n-1) { margin: 0; margin-bottom: 30px; } .artboard-classify .artboard-classify-main > div:nth-child(2n) { float: right; } } @media (max-width: 768px) { .artboard-bounties { background: url(../img/bg-320.jpg) no-repeat center top; background-size: 100%; } #myTargetElement-bugs{width: auto;} #myTargetElement-money{width: auto;} .artboard-classify .artboard-classify-main .artboard-classify-project .artboard-classify-pic img{height: 8rem;} .artboard-classify .artboard-classify-main .artboard-src-enter img{height: 17.5rem;} .artboard-classify .artboard-classify-main .artboard-src-enter .title{top: 5rem;} .artboard-classify .artboard-classify-main .artboard-src-enter .detail{top: 12.5rem;font-size: 1rem;color: #fff;} .artboard-banner { height: 10rem; } .artboard-banner .container .artboard-banner-wrap {padding-top: 1.5rem; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-aboutY { display: none; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count > div .artboard-banner-num { font-size: 1.5rem; text-align: center; margin-bottom: 1rem; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count > div .artboard-banner-tit { font-size: 0.7rem; margin-bottom: 0.2rem; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-consult { margin: 0; float: none; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money { margin: 0; float: none; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money .artboard-banner-num { text-align: center; height: auto; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money .artboard-banner-num i { float: none; } .artboard-banner .container .artboard-banner-wrap .artboard-banner-count .artboard-banner-money .artboard-banner-num span { float: none; line-height: 0.7rem; } .artboard-classify { height: 2.2rem; } .artboard-classify .container { width: 100%; padding: 0; } .artboard-classify .artboard-classify-header { overflow: hidden; margin-bottom: 1.5rem; } .artboard-classify .artboard-classify-header a { font-size: 0.6rem; float: left; width: 4rem; height: 2.2rem; line-height: 2.2rem; } .artboard-classify .artboard-classify-main #artboard-classify-project { float: none; width: 14.5rem; min-height: 17.5rem; margin: 0 auto; margin-bottom: 0.8rem; } .artboard-classify .artboard-classify-main #artboard-classify-project p { font-size: 0.6rem; padding-bottom: 1rem; margin-bottom: 1rem; } .artboard-classify .artboard-classify-main #artboard-classify-project h4 { font-size: 0.7rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-pic { margin-bottom: 0.5rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-time { font-size: 0.6rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-btn { width: 3rem; height: 2rem; line-height: 2rem; font-size: 0.6rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level { height: 1.5rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level span { font-size: 0.6rem; line-height: 1.2rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .artboard-classify-detail-star { width: 3.6rem; height: 1.15rem; background-size: 100%; } .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-tel{width: 90%;} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-mail{width: 90%;} .artboard-classify .artboard-classify-main .artboard-classify-project .src-classify-time{margin-bottom: 0;} .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades8 { background-position: 0 0; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades7 { background-position: 0 -1.15px; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades6 { background-position: 0 -2.3rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades5 { background-position: 0 -3.45rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades7 { background-position: 0 -4.6rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades3 { background-position: 0 -5.75rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades2 { background-position: 0 6.9rem; } .artboard-classify .artboard-classify-main #artboard-classify-project .artboard-classify-detail-level .grades1 { background-position: 0 8.05rem; } /*# sourceMappingURL=artboard-base.css.map */