.main{ background: url("../../images/bigData_bg.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; } @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; } }