.main{ background: #000426 url("../../images/bigData_bg2.png") no-repeat center; background-size: 100% 100%; width: 100vw; height: 100vh; overflow: hidden; } #userLogin{ padding: 0!important; } .logoData{ position: absolute; top: 4vh; left: 1vw; } .time{ display: flex; align-items: center; position: absolute; top: 4vh; right: 1vw; color: #2d8bff; } .time div:nth-child(1){ background: url("../../images/rl.png") no-repeat ; padding-left: 30px; } .time div:nth-child(2){ background: url("../../images/sz.png") no-repeat ; padding-left: 30px; margin: 0 15px; } .head{ background: url("../../images/head_bg.png") no-repeat center; width: 100vw; height: 10vh; position: relative; } .head_bg{ background: url("../../images/head_bg_animal.png") no-repeat center; width: 100vw; height: 10vh; animation: 2s opacity 0.1s infinite; position: absolute; } .head_tit{ font-size: 2.45rem; text-align: center; color: #ffffff; font-weight: bold; } .xuanzhuan { -webkit-transition-property: -webkit-transform; -webkit-transition-duration: 1s; -moz-transition-property: -moz-transform; -moz-transition-duration: 1s; -webkit-animation: rotate 3s linear infinite; -moz-animation: rotate 3s linear infinite; -o-animation: rotate 3s linear infinite; animation: rotate 3s linear infinite; } .horizontal { display: flex; position: absolute; right: 32vw; top: 4vh; } .axis { width: 1.8vw; height: 4vh; background: url('../../images/headline_hz.png') no-repeat; background-size: 100% 100%; margin-left: -.45vw; } .horizontal1 { display: flex; position: absolute; left: 32vw; top: 4vh; } .axis1 { width: 1.8vw; height: 4vh; background: url('../../images/headline_hz1.png') no-repeat; background-size: 100% 100%; margin-left: -.45vw; } .anmia1 { opacity: 1; animation: 2s horizontalAnmia1 0.1s infinite; } .anmia2 { opacity: 0.5; animation: 2s horizontalAnmia2 0.1s infinite; } .anmia3 { opacity: 0; animation: 2s horizontalAnmia3 0.1s infinite; } .tab_main{ display: flex; align-items: center; margin: 15px 0; } .tab_main div{ width: 6vw; height: 3vh; margin-right: 1vw; cursor: pointer; } .tab_main div:hover img{ display: block!important; } .tab1{ background: url('../../images/icon_jj_01.png') no-repeat; background-size: 100% 100%; } .tab2{ background: url('../../images/icon_jj_02.png') no-repeat; background-size: 100% 100%; } .tab3{ background: url('../../images/icon_jj_03.png') no-repeat; background-size: 100% 100%; } .tab4{ background: url('../../images/icon_jj_04.png') no-repeat; background-size: 100% 100%; } .tab5{ background: url('../../images/icon_jj_05.png') no-repeat; background-size: 100% 100%; } .tab6{ background: url('../../images/icon_jj_06.png') no-repeat; background-size: 100% 100%; } .tableList{ width: 100%!important; height: calc(100vh - 130px - 3vh - 10vh)!important; } .tableList table tr:nth-child(odd){ background-color: #13225e!important; } .tableList table tr td{ color: #ffffff; } .tableHead{ background: #133194!important; color: #ffffff!important; margin-top: 0!important; } .tableType{ background: #133194!important; } .bidding input[type='button']{ border-color: #ffffff; color: #ffffff; } .select_main{ /*border: 10px solid transparent!important;*/ /*-webkit-border-image: url(../../images/border_img.png) 1 stretch; !* Safari 3.1-5 *!*/ /*-o-border-image: url(../../images/border_img.png) 1 stretch; !* Opera 11-12.1 *!*/ } select{ color: #2d8bff; border-image: url(../../images/border_img.png) 3 stretch!important; margin-left: 1vw; } .tab_select{ display: flex; justify-content: space-between; align-items: center; width: 98%; margin: 0 auto; } .bidding{ width: 98%; margin: 0 auto; } .tableType p{ color: #ffffff!important; } .topTit_content{ width: 98%; border: 1px solid #0071ff; margin: 2vh auto 0; display: flex; justify-content: space-between; align-items: center; } .topTit_content_left{ display: flex; justify-content: space-between; width: 60%; align-items: center; } .topTit_content_left p:first-child{ color: #9cc8ff; background-image: linear-gradient(#001f7c,#003686,#001f7c); padding: 2vh .7vw; } .topTit_content_left p:nth-child(2){ color: #ffa90b; font-size: 3vh; width: 70%; text-align: center; } .topTit_content_left p:nth-child(3){ color: #00144e; background: #21d2ea; padding: .5vh 1vw; border-radius: 5px; } .topTit_content_center{ width: 19%; border-left: 1px solid #0071ff; text-align: center; } .topTit_content_center p{ color: #9cc8ff; } .topTit_content_center p:nth-child(2){ color: #ffa90b; } .topTit_content_center p:nth-child(2) span{ font-size: 5vh; font-weight: bold; } .content_box{ display: flex; width: 98%; margin: 1vw auto 0; justify-content: space-between; } .content_box_right{ border: 1px solid #0071ff; width: 38%; } .content_box_right_tit{ background: #133194; padding: 1vh 2vw; color: #21d3ed; font-weight: bold; margin-top: 1vh; } .content_box_right_titBox{ background: #133194; padding: 1vh 2vw; color: #21d3ed; font-weight: bold; margin-top: 1vh; display: flex; justify-content: space-between; } .content_box_right_titBox_check{ display: flex; align-items: center; color: #ffa90b; } .content_box_right_tit span{ } .content_box_right_tit2{ color: #dddddd; text-align: center; font-weight: bold; margin: 2vh 0; } .content_box_right_time{ color: #dddddd; text-align: center; margin-bottom: 2vh; } .content_box_right_time span{ color: #ffa90b; font-weight: bold; font-size: 3vh; background: #133194; padding: 1vh .5vw; margin-right: .3vw; } .content_box_right_money{ display: flex; text-align: center; padding: 0 2vw; justify-content: space-between; margin-bottom: 2vh; } .content_box_right_money div{ background: rgba(0,48,134,0.6); width: 48%; padding: 2vh 0 1vh; border-radius: 5px; } .content_box_right_num{ text-align: center; background: rgba(0,48,134,0.6); padding: 2vh 0 1vh; border-radius: 5px; width: calc(100% - 4vw); margin: 0 auto; } .content_box_right_num p{ color: #dddddd; } .content_box_right_num p:last-child{ color: #25e8ff; font-weight: bold; font-size: 2.5vh; } .content_box_right_money p{ color: #dddddd; } .content_box_right_money p:last-child{ color: #ffa90b; font-weight: bold; font-size: 2.5vh; } .ruleTable{ width: calc(100% - 4vw); margin: 0 auto; margin-top: 1vh; } .ruleTable tr td{ padding: 1vh 0; } .ruleTable tr td:nth-child(odd){ color: #9cc8ff; } .ruleTable tr td:nth-child(even){ color: #ffffff; } @keyframes horizontalAnmia1 { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } @keyframes horizontalAnmia2 { 0% { opacity: 0.5; } 25% { opacity: 1; } 75% { opacity: 0; } 100% { opacity: 0.5; } } @keyframes horizontalAnmia3 { 0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes rotate { from { -webkit-transform: rotate(0deg) } to { -webkit-transform: rotate(360deg) } } @-moz-keyframes rotate { from { -moz-transform: rotate(0deg) } to { -moz-transform: rotate(359deg) } } @-o-keyframes rotate { from { -o-transform: rotate(0deg) } to { -o-transform: rotate(359deg) } } @keyframes rotate { from { transform: rotate(0deg) } to { transform: rotate(359deg) } } @-webkit-keyframes opacity { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } } @-moz-keyframes opacity { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } } @-o-keyframes opacity { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } } @keyframes opacity { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }