hexo-theme-quiet/source/css/header.css

1 line
2.2 KiB
CSS

*{margin:0;padding:0;}.header{position:fixed;width:100%;z-index:99;}.header-top{display:flex;height:100px;background:rgba(255,255,255,0.98);z-index:99;padding:0 calc((100% - 1160px)/2);}.header-move1{height:72px;transition:height .8s ease-in-out;box-shadow:0 10px 40px 0 rgba(50,50,50,0.08);}.header-move2{height:100px;transition:height .8s ease-in-out;}.header .header-top .h-left{display:flex;flex-basis:0;justify-content:flex-start;align-items:center;flex-grow:1;}.header .header-top .h-left a{margin-left:18px;width:36px;height:36px;background-size:100% 100%;display:flex;justify-content:center;align-items:center;}.header .header-top .h-left a img{width:36px;height:36px;}.header .header-top .h-right{display:flex;flex-basis:0;justify-content:flex-end;align-items:center;flex-grow:1;}@media screen and (min-width:600px){.header .header-top .h-right-close{display:none;}}@media screen and (max-width:600px){.header .header-top .h-right{display:none;}.header .header-top .h-right-close{display:flex;flex-basis:0;justify-content:flex-end;align-items:center;flex-grow:1;margin-right:1em;}.header .header-top .h-right-close svg{cursor:pointer;width:2em;height:2em;}}.header .header-top .h-right ul{display:flex;align-items:center;font-size:16px;font-weight:400;text-transform:uppercase;list-style:none;}.header .header-top .h-right ul li{padding:0 18px;white-space:nowrap}.header .header-top .h-right ul li a{color:#898fa0;text-decoration:none;}.header .header-top .h-right ul li a:hover{color:#12183A;}.header .header-top .h-right ul li .dot{display:inline-block;width:5px;height:5px;border-radius:50%;position:relative;top:-12px;left:2px;}.header .header-top .h-right .select a{color:#12183A;}.header .header-top .h-right .select .dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#006AFF;position:relative;top:-12px;left:2px;}.header-bg{width:100%;display:flex;flex-shrink:0;background:linear-gradient(to top,#f1f5fb,#f9fcff);}.header-bg .bg-content{display:flex;flex-basis:721px;padding:196px 40px 160px;margin:0 auto;}.header-bg .bg-content h1{display:flex;margin-top:40px;font-size:30px;font-weight:500;color:#12183a;flex:1;flex-direction:column;}.header-bg .bg-content h1 span{display:flex;font-size:15px;margin-top:10px;color:#898F9F;}