/* FONT PATH * -------------------------- */ @font-face { font-family: 'FontAwesome'; src: url('static/font/fontawesome-webfont.eot?v=3.2.1'); src: url('static/font/fontawesome-webfont.eot?#iefix&v=3.2.1') format('embedded-opentype'), url('static/font/fontawesome-webfont.woff?v=3.2.1') format('woff'), url('static/font/fontawesome-webfont.ttf?v=3.2.1') format('truetype'), url('static/font/fontawesome-webfont.svg#fontawesomeregular?v=3.2.1') format('svg'); font-weight: normal; font-style: normal; } .mobi{width: 100%; height: 100%;} /*.art 存放页面动画效果的模块 1、light 光划过效果 鼠标划过光线区 2、 ... 其他动画效果可以在这里继续扩展 */ .art{ width: 100%; height: 100%; position: absolute; left: 0; right: 0; bottom: 0; top: 0; overflow: hidden; } .art .light {display: block; width: 100%; height: 100%; position: absolute; top: 0; left:-100%; } .art .light:before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; overflow: hidden; background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(50%, rgba(255,255,255,.2)), color-stop(100%, rgba(255,255,255,0))); background: -webkit-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.2)50%, rgba(255,255,255,0)100%); background: -o-linear-gradient(left, rgba(255,255,255,0)0, rgba(255,255,255,.2)50%, rgba(255,255,255,0)100%); -webkit-transform: skewX(-25deg); -moz-transform: skewX(-25deg); } .art.active .light{ left:100%; transition: left 1s ease 0s; } /*动画区 1、animated 总控 2、.loader-15 上下手风琴拉动Loading 3、.rotate 旋转360度 4、.rotateF 反向360度 5、.flashPD 一闪一闪 */ .animated { animation-duration: 1s; animation-fill-mode: both; } .animated.infinite { animation-iteration-count: infinite; } /*上下手风琴拉动*/ [class*="loader-"] { display: inline-block; width: 1em; height: 1em; color: inherit; vertical-align: middle; pointer-events: none; } .loader-15 { background: currentcolor; position: relative; -webkit-animation: loader-15 1s ease-in-out infinite; animation: loader-15 1s ease-in-out infinite; -webkit-animation-delay: 0.4s; animation-delay: 0.4s; width: .25em; height: .5em; } .loader-15:after, .loader-15:before { content: ''; position: absolute; width: inherit; height: inherit; background: inherit; -webkit-animation: inherit; animation: inherit; } .loader-15:before { right: .5em; -webkit-animation-delay: 0.2s; animation-delay: 0.2s; } .loader-15:after { left: .5em; -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } @-webkit-keyframes loader-15 { 0%, 100% { box-shadow: 0 0 0 currentcolor, 0 0 0 currentcolor; } 50% { box-shadow: 0 -.25em 0 currentcolor, 0 .25em 0 currentcolor; } } @keyframes loader-15 { 0%, 100% { box-shadow: 0 0 0 currentcolor, 0 0 0 currentcolor; } 50% { box-shadow: 0 -.25em 0 currentcolor, 0 .25em 0 currentcolor; } } @keyframes rotate { 0% { transform-origin: center; transform: rotate(0deg); } 100% { transform-origin: center; transform: rotate(360deg); } } .rotate { animation-name: rotate; animation-timing-function: linear; } @keyframes rotateF { 100% { transform-origin: center; transform: rotate(-360deg); } } .rotateF { animation-name: rotateF; animation-timing-function: linear; } @keyframes flashPD { 0%,90% { opacity: 1; } 92%,98% { opacity: 0; } 96%,100% { opacity: 1; } } .flashPD { animation-name: flashPD; } /*地球仪*/ .ball { position: absolute; top:-4%; left: 50%; width:80%; height: 100%; margin-left:-40%; opacity: .6; background:url(static/images/theme/darkblue/ball.png) center center no-repeat; background-size:auto 100%; animation-duration: 120s; animation-delay: 3s; } /* 当浏览器可视区域小于2000px*/ @media screen and (max-width:2000px){ .logo{font-size:28px; line-height:2;} .ftext20{ font-size:14px;} .ftext{ font-size:16px;} .ftext_xl{ font-size: 20px;} .layer-body{ width: 92%; } .layer-body .ftext{ font-size:22px; } .layer-body .ftext_xl{ font-size: 26px;} .fnum_xl{ font-size: 26px;} .layer-body .fnum_xl{ font-size: 30px;} .tooltip{ width:260px;} .tb-custom-01 tr .tbname { width:36vh; } .layer-body .grid-custom{ padding:9.4vh 1vh 0 1vh; } .custom-15 .div15-right{ margin-left:0px;} .layui-form-radio>div{font-size:20px} } /* 当浏览器可视区域小于1366px*/ @media screen and (max-width:1367px){ .ftext20{ font-size:12px;} .ftext{ font-size:14px;} .ftext_xl{ font-size: 16px;} .layer-body .ftext{ font-size:14px; } .layer-body .ftext_xl{ font-size: 16px;} .custom-15 .div15-right{margin-left:0px;} .layui-form-radio>div{font-size:16px} }