/* Theme Name: Dahuzi Theme URI:http://www.xintheme.com Description:www.XinTheme.com 专为WordPress建站而生！官方网站：XinTheme Version:3.1 Author:大胡子 Author URI: http://www.dahuzi.me/ */ ::selection{background:#FEFAC7;color:#555} html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%} body{font-family:sans-serif;font-size:15px;background-color:#fff;height:100%;width:100%;margin:0;padding:0;} article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block} audio,canvas,progress,video{display:inline-block;vertical-align:baseline} audio:not([controls]){display:none;height:0} [hidden],template{display:none} a{background:transparent} a:active,a:hover{outline:0} abbr[title]{border-bottom:1px dotted} b,strong{font-weight:bold} dfn{font-style:italic} h1{font-size:2em;margin:0.67em 0} mark{background:#ff0;color:#000} small{font-size:80%} sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline} sup{top:-0.5em} sub{bottom:-0.25em} img{border:0} svg:not(:root){overflow:hidden} figure{margin:1em 40px} hr{max-width:100%;height:50px;background:url(static/icon/hr.gif) right center no-repeat;border:none;margin-top: 30px;margin-bottom: 30px;} pre{overflow:auto} code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em} button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0} button{overflow:visible} button,select{text-transform:none} button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer} button[disabled],html input[disabled]{cursor:default} button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0} input{line-height:normal} input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0} input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto} input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box} input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none} fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em} legend{border:0;padding:0} textarea{overflow:auto} optgroup{font-weight:bold} table{border-collapse:collapse;border-spacing:0} td,th{padding:0} body,h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dd,ol,ul,form,fieldset,legend,figure,table,th,td,caption{margin:0;padding:0} abbr[title],dfn[title]{cursor:help} u,ins{text-decoration:none} ins{border-bottom:1px solid} html{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} *,*:before,*:after{-webkit-box-sizing:inherit;-moz-box-sizing:inherit;box-sizing:inherit} .box{display:block;padding:24px} .box > :last-child{margin-bottom:0} .btn,.wpcf7-submit,[id="submit"]{display:inline-block;vertical-align:middle;font:inherit;text-align:center;border:none;margin:0;cursor:pointer;overflow:visible;padding:11px 23px;background-color:#4a8ec2;border:1px solid #4a8ec2;border-radius:3px} .btn,.wpcf7-submit,[id="submit"],.btn:hover,.wpcf7-submit:hover,[id="submit"]:hover,.btn:active,.wpcf7-submit:active,[id="submit"]:active,.btn:focus,.wpcf7-submit:focus,[id="submit"]:focus{text-decoration:none;color:#fff} .btn::-moz-focus-inner,.wpcf7-submit::-moz-focus-inner,[id="submit"]::-moz-focus-inner{border:0;padding:0} .clearfix:after,.box:after,.split:after{content:"";display:table;clear:both} .flag{display:table;width:100%} .flag__img,.flag__body{display:table-cell;vertical-align:middle} .flag__img{padding-right:30px} .flag__img > img{display:block;max-width:none} .flag__body{width:100%} .flag__body,.flag__body > :last-child{margin-bottom:0} h1,.alpha{font-size:32px;font-size:2rem;line-height:1.5} h2,.beta{font-size:24px;font-size:1.5rem;line-height:1.5} h3,.gamma{font-size:20px;font-size:1.25rem;line-height:1.2} h4,.delta{font-size:18px;font-size:1.125rem;line-height:1.33333} h5,.epsilon{font-size:16px;font-size:1rem;line-height:1.5} h6,.zeta{font-size:14px;font-size:0.875rem;line-height:1.71429} img{max-width:100%;font-style:italic;vertical-align:middle} .gm-style img,img[width],img[height]{max-width:none} html{line-height:1.5;background-color:#fff;color:#333;overflow-y:scroll;overflow-x: hidden;min-height:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased} .lede{font-size:18px;font-size:1.125rem;line-height:1.33333} @media print{*{background:transparent !important;color:#000 !important;box-shadow:none !important;text-shadow:none !important} a,a:visited{text-decoration:none} a[href]:after{content:" (" attr(href) ")"} abbr[title]:after{content:" (" attr(title) ")"} a[href^="#"]:after,a[href^="javascript:"]:after{content:""} } h1,h2,h3,h4,h5,h6,ul,ol,dl,blockquote,p,address,table,fieldset,figure,pre{margin-bottom:30px;margin-bottom:1.875rem} ol,ul{list-style:none} .table{width:100%} .tabs{margin:0;padding:0;list-style:none;display:table;table-layout:fixed;width:100%;text-align:center} .tabs__item{display:table-cell} .tabs__link{display:block} .btn,.wpcf7-submit,[id="submit"]{font-weight:bold;-webkit-transition:background 0.333s ease,box-shadow .25s ease;-moz-transition:background 0.333s ease,box-shadow .25s ease;transition:background 0.333s ease,box-shadow .25s ease} [id="submit"],.wpcf7-submit,.btn--primary,[id="submit"]{font-size:14px;font-size:0.875rem;line-height:21px;color:#fff;border:none;background:#4f94cb;padding:9px 24px;font-weight:bold} [id="submit"]:hover,[id="submit"]:focus,.wpcf7-submit:hover,.wpcf7-submit:focus,.btn--primary:hover,[id="submit"]:hover,.btn--primary:focus,[id="submit"]:focus{box-shadow:inset 0 -8em 0 rgba(255,255,255,0.2);color:#fff;outline:none} [id="submit"]:active,.wpcf7-submit:active,.btn--primary:active,[id="submit"]:active{color:#fff;box-shadow:inset 0 -8em 0 rgba(0,0,0,0.15);outline:none} .wpcf7-text,.wpcf7-number,.wpcf7-select,.wpcf7-textarea,.text-input{font-size:14px;font-size:0.875rem;background:#f1f2f2;border:1px solid #eee;color:#666;border-radius:3px;padding:10px 12px} .wpcf7-text:focus,.wpcf7-number:focus,.wpcf7-select:focus,.wpcf7-textarea:focus,.text-input:focus{background:#fff;color:#5b5e5f;border-color:#4f94cb;outline:none;box-shadow:0 0 3px rgba(95,140,196,0.25)} .wpcf7-text:disabled,.wpcf7-number:disabled,.wpcf7-select:disabled,.wpcf7-textarea:disabled,.text-input:disabled{color:#aaa} .wpcf7-text--small,.wpcf7-number--small,.wpcf7-select--small,.wpcf7-textarea--small,.text-input--small{padding:8px 12px} .wpcf7-form-control{width:100%} .wpcf7-submit,.wpcf7-acceptance{width:auto} textarea{resize:vertical} ::-webkit-input-placeholder{color:#aaa} :-moz-placeholder{color:#aaa} ::-moz-placeholder{color:#aaa} :-ms-input-placeholder{color:#aaa} .go-input{display:table;width:100%} .go-input input{display:inline-block;vertical-align:top} @media screen and (max-width:719px){.go-input--responsive{width:100%;display:block} .go-input--responsive input{width:100%} .go-input--responsive .go-input__text,.go-input--responsive .go-input__go{display:block;width:100%} .go-input--responsive .go-input__go{margin-top:8px;padding:0;display:block} } .go-input__text,.go-input__go{display:table-cell;vertical-align:top} .go-input__text{width:100%;position:relative} .go-input__text input{width:100%} .go-input__go{padding-left:8px} .go-input__go input{padding:6px 24px} img{max-width:100%;height:auto} h1,h2,h3,h4,h5,h6{color:#666;font-weight:300} .rule{display:block;border:none;border-top:1px solid #eee} .rule--ornament{position:relative} .rule--ornament .rule__ornament{font-size:20px;font-size:1.25rem;line-height:1;color:#ccc;padding:0 7px;position:absolute;top:-10px;left:50%;margin-left:-16px;background:#fff} a{color:#666666;text-decoration:none} a:focus,a:hover{text-decoration:none} .milli{font-size:12px;font-size:0.75rem} .micro{font-size:11px;font-size:0.6875rem} .social-block > *{display:inline-block !important;vertical-align:top !important} .split{text-align:right} .split__title{text-align:center;font-weight:500;text-transform:uppercase} @media screen and (max-width:719px){ .split--responsive .split__title{display:block;text-align:center;margin-bottom:12px;float:none} } @media screen and (max-width:1023px){.split--responsive-portable{text-align:center} .split--responsive-portable .split__title{display:block;text-align:center;margin-bottom:12px;float:none} } .wrapper{max-width:850px;padding:0 30px;margin-left:auto;margin-right:auto} .wrapper--wide{max-width:940px} .primary-nav{font-size:24px;font-size:1.5rem} .primary-nav a{padding:10px 0;display:inline-block;color:#fff} .primary-nav a:hover{text-decoration:none} .categories-nav{font-size:16px;font-size:1rem;line-height:32px} .categories-nav a{color:#fff} .categories-nav a:hover{text-decoration:none} .post img{border-radius:0px} .post iframe{max-width:100%} .post [rel="gallery"]{position:relative;display:block} .post [rel="gallery"] img{margin:0} .post [rel="gallery"]:hover:after,.post [rel="gallery"]:hover:before{visibility:visible} .post [rel="gallery"]:hover:after{opacity:.75} .post [rel="gallery"]:hover:before{opacity:1} .post [rel="gallery"]:after,.post [rel="gallery"]:before{-webkit-transition:opacity 0.25s ease,visibility 0.25s ease;-moz-transition:opacity 0.25s ease,visibility 0.25s ease;-ms-transition:opacity 0.25s ease,visibility 0.25s ease;-o-transition:opacity 0.25s ease,visibility 0.25s ease;transition:opacity 0.25s ease,visibility 0.25s ease;position:absolute;opacity:0;visibility:hidden} .post [rel="gallery"]:after{content:'';top:0;right:0;left:0;bottom:0;overflow:hidden;border-radius:3px} .post [rel="gallery"]:before{font-size:24px;font-size:1.5rem;line-height:1;z-index:1;color:#fff;content:"\e606";font-family:iconfont;top:50%;left:50%;margin-left:-12px;margin-top:-12px} .post-thumbnail{margin-bottom:30px;display:block} /************************************************************************************** ************** ************** Basics ************** ****************************************************************************************/ .col,.col1,.col10,.col11,.col12,.col2,.col20,.col3,.col4,.col5,.col6,.col7,.col8,.col9{position:relative;min-height:1px;float:left;padding-right:20px;padding-left:20px} .col12{width:100%} .col11{width:91.66666667%} .col10{width:83.33333333%} .col9{width:75%} .col8{width:66.66666667%} .col7{width:58.33333333%} .col6{width:50%} .col5{width:41.66666667%} .col4{width:33.33333333%} .col3{width:25%} .col2{width:16.66666667%} .col1{width:8.33333333%} .col20{width:20%} /************************************************************************************** ************** ************** Single ************** ****************************************************************************************/ .post-title{font-size:24px;font-weight:700;line-height:1.4;margin-bottom:40px;position:relative;color:#333} /*.post-title:before{content:"";background-color:#ccc;width:6px;height:6px;border-radius:50%;left:0;bottom:-22px;z-index:1;position:absolute}*/ .post-title:after{content:"";width:120px;height:1px;bottom:-20px;left:0;position:absolute;background:linear-gradient(to right,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-ms-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-o-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-moz-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-gradient(linear,left top,right top,color-stop(0,#e0e0e0),color-stop(35%,#e0e0e0),color-stop(65%,#e0e0e0),color-stop(100%,#fff))} .single .post-meta span,.single .post-meta span a{font-size:14px;color:#ccc} .single .single_tag{width:70%;overflow:hidden;text-align:left;display:inline-block;float:left} .single .single_tag a{border-bottom:1px dashed #b5b5b5} .single .single_tag a:hover{color:#ff374a;border-bottom-color:#333} /* Gallery */ .wp-block-gallery ul.blocks-gallery-grid{padding:0;border:none;margin:0} .wp-block-gallery ul.blocks-gallery-grid li{padding:0} .wp-block-gallery ul.blocks-gallery-grid li:before{display:none} /* Comment */ #panel{display:none;padding-bottom:60px;background-color:#FAFAFA} .slide{background:transparent} .btn-slide i{margin-right:5px} .btn-slide{cursor: pointer;color:#CCC;display:block;text-decoration: none;float:right;} .post-status.post-status--large{font-size:inherit;margin-left:-40px;margin-top:10px;color:#ddd} .post-status.fa-lock{color:#ccc} .meta,.post-date{font-size:13px;color:#ccc;text-transform:uppercase;margin-bottom:30px} .meta time,.post-date time{letter-spacing:1px} .meta a,.post-date a{margin-right:5px;color:#ccc} .post-body p{font-size:15px;line-height:1.6;color:#555} .post-body > :last-child{margin-bottom:0} .post-body img{max-width:100%;height:auto} .post-body code{background:#eee;padding:2px 5px 2px;margin:0 1px;border-radius:4px;position:relative;} .post-body p,.post-body figure{margin-bottom:30px} .post-body p + h1,.post-body p + h2,.post-body p + h3,.post-body p + h4,.post-body p + h5,.post-body p + h6{margin-top:40px;margin-bottom:30px} .post-body h2{font-size:30px;font-size:1.875rem;line-height:40px} .post-body h2{font-size:27px;font-size:1.6875rem;line-height:37px} .post-body h3{font-size:20px;line-height:34px;color:#555;font-weight:bolder;display:table;white-space:nowrap} .post-body h3.has-text-align-center{color:#777;border-spacing:20px 0} .post-body h3.has-text-align-center:after,.post-body h3.has-text-align-center:before{content:"";display:table-cell;width:50%;background:linear-gradient(#eee,#eee) repeat-x left center;background-size:1px 1px} .post-body h4{font-size:18px;font-size:1.125rem;line-height:28px} .post-body h5,.post-body h6{text-transform:uppercase} .post-body ul,.post-body ol{font-size:15px;border:1px solid #efefef;padding:5px 20px;margin:0 0 30px 0;list-style:none;border-radius:3px} .post-body ul li,.post-body ol li{font-size:15px;line-height:21px;padding:10px 0 10px 25px} .post-body ul li:before,.post-body ol li:before{float:left;vertical-align:middle;margin-right:10px;margin-left:-25px;color:#ddd} .post-body ul li ~ li,.post-body ol li ~ li{border-top:1px solid #efefef} .post-body ul li:before{color:#efefef;font-size:11px;font-size:0.6875rem;content:"\e60d";font-family:iconfont} .post-body ol{counter-reset:ol-counter} .post-body ol li:before{content:counter(ol-counter) ".";counter-increment:ol-counter} .post-body pre{font-size:14px;font-size:0.875rem;line-height:24px;color:#666;background:#f5f5f5;border-radius:3px;padding:15px 20px} .post-body blockquote{font-size:18px;font-size:1rem;line-height:36px;font-weight:300;color:#aaa;padding-left:55px;margin-bottom:30px;position:relative} .post-body blockquote :last-child{margin-bottom:0} .post-body blockquote:before{font-size:60px;font-size:3.75rem;content:'\201C';color:#ddd;font-family:Georgia,"Times New Roman",Times,serif;position:absolute;top:15px;left:10px} .format-lede .post-body > :first-child{font-size:24px;font-size:1.5rem;line-height:36px;font-family:din,'Hiragino Sans GB','Microsoft Yahei',Arial,sans-serif;font-weight:300;color:#444} .post-share{-webkit-transition:opacity 0.25s ease;-moz-transition:opacity 0.25s ease;-ms-transition:opacity 0.25s ease;-o-transition:opacity 0.25s ease;transition:opacity 0.25s ease;opacity:.5;display:inline-block;text-align:right} @media screen and (max-width:719px){.post-share{text-align:center} } .post-share:hover{opacity:1} .alert{font-size:15px;line-height:24px;padding:11px 20px;border-radius:3px} .alert--success{background:#d7f1d7;color:#578e57} .alert--warn{background:#ffe88a;color:#8e7030} .round-avatars .avatar,.round-avatars .avatar img{border-radius:3em} .avatar,.avatar img{border-radius:3px} [id="infscr-loading"]{text-align:center;margin-top:30px;margin-bottom:30px} [id="infscr-loading"] div{display:none} .pullquote{font-size:18px;font-size:1.125rem;line-height:36px;color:#888;font-weight:300;position:relative;margin:45px 0 20px 0;display:block;border-top:1px solid #efefef;border-bottom:1px solid #efefef;padding:15px 0} @media screen and (min-width:720px){.pullquote{width:220px;float:right;margin:20px -160px 20px 20px} } .mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#000;opacity:0.85} .mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:1043;position:fixed;outline:none !important;-webkit-backface-visibility:hidden} .mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} .mfp-container:before{content:'';display:inline-block;height:100%;vertical-align:middle} .mfp-align-top .mfp-container:before{display:none} .mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045} .mfp-inline-holder .mfp-content,.mfp-ajax-holder .mfp-content{width:100%;cursor:auto} .mfp-ajax-cur{cursor:progress} .mfp-zoom-out-cur,.mfp-zoom-out-cur .mfp-image-holder .mfp-close{cursor:-moz-zoom-out;cursor:-webkit-zoom-out;cursor:zoom-out} .mfp-zoom{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in} .mfp-auto-cursor .mfp-content{cursor:auto} .mfp-close,.mfp-arrow,.mfp-preloader,.mfp-counter{-webkit-user-select:none;-moz-user-select:none;user-select:none} .mfp-loading.mfp-figure{display:none} .mfp-hide{display:none !important} .mfp-preloader{color:#CCC;position:absolute;top:50%;width:auto;text-align:center;margin-top:-0.8em;left:8px;right:8px;z-index:1044} .mfp-preloader a{color:#CCC} .mfp-preloader a:hover{color:#FFF} .mfp-s-ready .mfp-preloader{display:none} .mfp-s-error .mfp-content{display:none} button.mfp-close,button.mfp-arrow{overflow:visible;cursor:pointer;background:transparent;border:0;-webkit-appearance:none;display:block;outline:none;padding:0;z-index:1046;-webkit-box-shadow:none;box-shadow:none} button::-moz-focus-inner{padding:0;border:0} .mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:0.65;padding:0 0 18px 10px;color:#FFF;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace} .mfp-close:hover,.mfp-close:focus{opacity:1} .mfp-close:active{top:1px} .mfp-close-btn-in .mfp-close{color:#333} .mfp-image-holder .mfp-close,.mfp-iframe-holder .mfp-close{color:#FFF;right:-6px;text-align:right;padding-right:6px;width:100%} .mfp-counter{font-size:12px;font-size:0.75rem;color:#fff;opacity:.5;line-height:1.5;margin-bottom:10px} .mfp-arrow{position:absolute;color:#fff;opacity:0.65;margin:0;top:50%;padding:0;font-size:36px;-webkit-tap-highlight-color:transparent} .mfp-arrow:hover,.mfp-arrow:focus{opacity:1} .mfp-arrow:after{content:'';font-family:iconfont;display:block} .mfp-arrow-left{left:10px} .mfp-arrow-left:after{content:'\e60a'} .mfp-arrow-right{right:10px} .mfp-arrow-right:after{content:'\e60b'} .mfp-iframe-holder{padding-top:40px;padding-bottom:40px} .mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px} .mfp-iframe-holder .mfp-close{top:-40px} .mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%} .mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,0.6);background:#000} img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:40px 0 70px;margin:0 auto} .mfp-figure{line-height:0} .mfp-figure:after{content:'';position:absolute;left:0;top:40px;bottom:70px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,0.6);background:#444} .mfp-figure small{color:#BDBDBD;display:block;font-size:12px;line-height:14px} .mfp-figure figure{margin:0} .mfp-bottom-bar{margin-top:-66px;position:absolute;top:100%;left:0;width:100%;cursor:auto;text-align:center} .mfp-title{font-size:14px;font-size:0.875rem;color:#fff;line-height:28px;word-wrap:break-word;margin:10px 0 -5px 0} .mfp-image-holder .mfp-content{max-width:100%} .mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer} @media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0} .mfp-img-mobile img.mfp-img{padding:0} .mfp-img-mobile .mfp-figure:after{top:0;bottom:0} .mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px} .mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,0.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} .mfp-img-mobile .mfp-bottom-bar:empty{padding:0} .mfp-img-mobile .mfp-counter{right:5px;top:3px} .mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,0.6);position:fixed;text-align:center;padding:0} } @media all and (max-width:900px){.mfp-arrow{-webkit-transform:scale(0.75);transform:scale(0.75)} .mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0} .mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%} .mfp-container{padding-left:6px;padding-right:6px} } @media screen and (max-width:719px){ .post-status{font-size:40px;margin-left:5px;margin-top:-40px} .linkpage ul li ul li{width:100% !important} .linkpage ul li ul li a{width:100% !important;margin-left:0px !important} .chat_content .bub{width:90% !important} } .footer{font-size:16px;color:#ffffff;padding:100px 0;background-color:#002a38} .footer a{color:#ffffff} .alignnone{margin:5px 20px 20px 0} .aligncenter,div.aligncenter{display:block;margin:5px auto 5px auto} .alignright{float:right;margin:5px 0 20px 20px} .alignleft{float:left;margin:5px 20px 20px 0} a img.alignright{float:right;margin:5px 0 20px 20px} a img.alignnone{margin:5px 20px 20px 0} a img.alignleft{float:left;margin:5px 20px 20px 0} a img.aligncenter{display:block;margin-left:auto;margin-right:auto} @media screen and (min-width:720px){.fancy-captions .wp-caption{max-width:100%;position:relative} .fancy-captions .wp-caption .wp-caption-text{text-align:right;position:absolute;right:100%;margin:0 20px 0 0;bottom:0;width:140px} } .wp-caption{max-width:100%;position:relative} .wp-caption .wp-caption-text{font-size:11px;font-size:0.6875rem;line-height:16px;margin:10px 20px 0 0;color:#aaa} .wp-caption.alignnone{margin:5px 20px 20px 0} .wp-caption.alignleft{margin:5px 20px 20px 0} .wp-caption.alignright{margin:5px 0 20px 20px} .gallery-caption{font-size:11px;line-height:17px;margin:0;padding:0 4px 5px} [class~="1/1"]{width:100% !important} [class~="1/2"],[class~="2/4"],[class~="3/6"],[class~="4/8"],[class~="5/10"],[class~="6/12"]{width:50% !important} [class~="1/3"],[class~="2/6"],[class~="3/9"],[class~="4/12"]{width:33.3333333% !important} [class~="2/3"],[class~="4/6"],[class~="6/9"],[class~="8/12"]{width:66.6666666% !important} [class~="1/4"],[class~="2/8"],[class~="3/12"]{width:25% !important} [class~="3/4"],[class~="6/8"],[class~="9/12"]{width:75% !important} [class~="1/5"],[class~="2/10"]{width:20% !important} [class~="2/5"],[class~="4/10"]{width:40% !important} [class~="3/5"],[class~="6/10"]{width:60% !important} [class~="4/5"],[class~="8/10"]{width:80% !important} [class~="1/6"],[class~="2/12"]{width:16.6666666% !important} [class~="5/6"],[class~="10/12"]{width:83.3333333% !important} [class~="1/8"]{width:12.5% !important} [class~="3/8"]{width:37.5% !important} [class~="5/8"]{width:62.5% !important} [class~="7/8"]{width:87.5% !important} [class~="1/9"]{width:11.1111111% !important} [class~="2/9"]{width:22.2222222% !important} [class~="4/9"]{width:44.4444444% !important} [class~="5/9"]{width:55.5555555% !important} [class~="7/9"]{width:77.7777777% !important} [class~="8/9"]{width:88.8888888% !important} [class~="1/10"]{width:10% !important} [class~="3/10"]{width:30% !important} [class~="7/10"]{width:70% !important} [class~="9/10"]{width:90% !important} [class~="1/12"]{width:8.3333333% !important} [class~="5/12"]{width:41.6666666% !important} [class~="7/12"]{width:58.3333333% !important} [class~="11/12"]{width:91.6666666% !important} .m{margin:30px !important} .mt{margin-top:30px !important} .mr{margin-right:30px !important} .mb{margin:30px 0 !important} .ml{margin-left:30px !important} .mh{margin-right:30px !important;margin-left:30px !important} .mv{margin-top:30px !important;margin-bottom:30px !important} .m--{margin:8px !important} .mt--{margin-top:8px !important} .mr--{margin-right:8px !important} .mb--{margin-bottom:8px !important} .ml--{margin-left:8px !important} .mh--{margin-right:8px !important;margin-left:8px !important} .mv--{margin-top:8px !important;margin-bottom:8px !important} .m-{margin:15px !important} .mt-{margin-top:15px !important} .mr-{margin-right:15px !important} .mb-{margin-bottom:15px !important} .ml-{margin-left:15px !important} .mh-{margin-right:15px !important;margin-left:15px !important} .mv-{margin-top:15px !important;margin-bottom:15px !important} .m\+{margin:60px !important} .mt\+{margin-top:60px !important} .mr\+{margin-right:60px !important} .mb\+{margin-bottom:60px !important} .ml\+{margin-left:60px !important} .mh\+{margin-right:60px !important;margin-left:60px !important} .mv\+{margin-top:60px !important;margin-bottom:60px !important} .m\+\+{margin:120px !important} .mt\+\+{margin-top:120px !important} .mr\+\+{margin-right:120px !important} .mb\+\+{margin-bottom:120px !important} .ml\+\+{margin-left:120px !important} .mh\+\+{margin-right:120px !important;margin-left:120px !important} .mv\+\+{margin-top:120px !important;margin-bottom:120px !important} .m0{margin:0 !important} .mt0{margin-top:0 !important} .mr0{margin-right:0 !important} .mb0{margin-bottom:0 !important} .ml0{margin-left:0 !important} .mh0{margin-right:0 !important;margin-left:0 !important} .mv0{margin-top:0 !important;margin-bottom:0 !important} @media screen and (max-width:719px){.palm-m{margin:30px !important} .palm-mt{margin-top:30px !important} .palm-mr{margin-right:30px !important} .palm-ml{margin-left:30px !important} .palm-mh{margin-right:30px !important;margin-left:30px !important} .palm-mv{margin-top:30px !important;margin-bottom:30px !important} } @media screen and (min-width:720px) and (max-width:1023px){.lap-m{margin:30px !important} .lap-mt{margin-top:30px !important} .lap-mr{margin-right:30px !important} .lap-mb{margin-bottom:30px !important} .lap-ml{margin-left:30px !important} .lap-mh{margin-right:30px !important;margin-left:30px !important} .lap-mv{margin-top:30px !important;margin-bottom:30px !important} } @media screen and (min-width:720px){.lap-and-up-m{margin:30px !important} .lap-and-up-mt{margin-top:30px !important} .lap-and-up-mr{margin-right:30px !important} .lap-and-up-mb{margin-bottom:30px !important} .lap-and-up-ml{margin-left:30px !important} .lap-and-up-mh{margin-right:30px !important;margin-left:30px !important} .lap-and-up-mv{margin-top:30px !important;margin-bottom:30px !important} } @media screen and (max-width:1023px){.portable-m{margin:30px !important} .portable-mt{margin-top:30px !important} .portable-mr{margin-right:30px !important} .portable-mb{margin-bottom:30px !important} .portable-ml{margin-left:30px !important} .portable-mh{margin-right:30px !important;margin-left:30px !important} .portable-mv{margin-top:30px !important;margin-bottom:30px !important} } @media screen and (min-width:1024px){.desk-m{margin:30px !important} .desk-mt{margin-top:30px !important} .desk-mr{margin-right:30px !important} .desk-mb{margin-bottom:30px !important} .desk-ml{margin-left:30px !important} .desk-mh{margin-right:30px !important;margin-left:30px !important} .desk-mv{margin-top:30px !important;margin-bottom:30px !important} } .text--center{text-align:center} .text--left{text-align:left} .text--right{text-align:right} .color--light{color:#aaa} /************************************************************************************** ************** ************** Banner ************** ****************************************************************************************/ .header-banner{position:relative;display:block;width:100%} .header-banner .top-image img{width:100%;max-height:550px;object-fit:cover} .header-banner #wave-canvas{position:absolute;bottom:-1px;left:0;width:100%;height:100%;z-index:0;pointer-events:none} .header-banner:before{content:"";height:250px;opacity:.7;width:100%;z-index:5;position:relative;background:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,0)),to(#000));background:-webkit-linear-gradient(bottom,rgba(0,0,0,0) 0,#000 100%);background:-o-linear-gradient(bottom,rgba(0,0,0,0) 0,#000 100%);background:linear-gradient(0deg,rgba(0,0,0,0) 0,#000 100%);display:block;position:absolute;top:0;left:0;pointer-events:none;-webkit-backface-visibility:hidden} /* 横线遮罩 */ .banner-mask{background:url(static/icon/mask.png) repeat;position:absolute;top:0;left:0;width:100%;height:100%} @media screen and (max-width:719px){ .header-banner .top-image{margin:0} .header-banner:before{height:70px} } /************************************************************************************** ************** ************** Header ************** ****************************************************************************************/ /* 导航栏 */ header{position:absolute;top:35px;width:100%;font-size:14px;z-index:6} header .header-container{width:90%;margin:0 auto;flex-wrap:nowrap;justify-content:flex-start;display:flex} header #logo{display:inline-block;width:auto;height:100%} header #logo img{display:block;width:auto;height:50px;opacity:.8} header #logo .site-title{font-size:22px;color:#fff;font-weight:700;margin:0;letter-spacing:1px} header nav{display:flex;margin-left:auto!important;align-items:center} header nav .menu{margin:0} header nav .menu .menu-item{display:inline-block;padding-right:20px} header nav .menu .menu-item a{color:#fff;font-size:15px;font-weight:700} header nav .menu .menu-item.current-menu-item a{box-shadow:inset 0 -20px 10px -15px #ff374a} header nav .menu .menu-item a:hover{-webkit-transition:box-shadow .2s linear;transition:box-shadow .2s linear;box-shadow:inset 0 -20px 10px -15px #ff374a} .header_sliding_sidebar_control{display:flex;align-items:center} .header_sliding_sidebar_control.nonav{margin-left:auto!important} /* 悬停导航栏 */ header.scrolled{position:fixed;background:#fff;height:75px;top:0;align-items:center;display:flex;-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out;box-shadow:0px 2px 0px rgba(157, 157, 157, 0.1)} header.scrolled nav .menu .menu-item a,header.scrolled #logo .site-title{color:#666} header.scrolled .js-toggle-search{-webkit-transition:all 300ms ease-in-out;transition:all 300ms ease-in-out} header.scrolled .js-toggle-search svg{fill:#666} /* 搜索 */ .js-toggle-search{display:flex;align-items:center;-webkit-transition:all .5s ease-in-out;transition:all .5s ease-in-out} .js-toggle-search:hover{cursor:pointer;color: #666;} html.search-visible{overflow:hidden;height:100%} /************************************************************************************** ************** ************** Posts List ************** ****************************************************************************************/ .archive-title{font-size:24px;margin-top:0;margin-bottom:36px;padding-bottom:20px;position:relative;font-weight:500;color:#333} .archive-title:before{content:"";background-color:#000;width:6px;height:6px;border-radius:50%;left:0;bottom:0;z-index:1;position:absolute} .archive-title:after{content:"";width:120px;height:1px;bottom:2.5px;left:0;position:absolute;background:linear-gradient(to right,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-ms-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-o-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-moz-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-gradient(linear,left top,right top,color-stop(0,#e0e0e0),color-stop(35%,#e0e0e0),color-stop(65%,#e0e0e0),color-stop(100%,#fff))} .posts-list{display:inline-block;margin-bottom:30px} .posts-list>li{list-style:none;position:relative} .posts-list>li~li{border-top:1px solid #e6e6e670;width:100%;padding-top:25px;margin-top:0px;display:inline-block} .posts-list .post-content{padding-top:0;float:left;width:calc(100% - 150px)} .posts-list h2{font-size:20px;margin-bottom:8px;font-weight:700;position:relative;padding-bottom:15px;line-height:initial} .posts-list h2 a{color:#333} .posts-list p{font-size:16px;line-height:1.5;color:#555;min-height:48px;margin-bottom:25px} .posts-list .post-status{float:left;margin-left:-30px} /*.posts-list h2 a:before{content:"";background-color:#666;width:5px;height:5px;border-radius:50%;left:0;bottom:0;z-index:1;position:absolute}*/ .posts-list h2 a:after{content:"";width:120px;height:1px;bottom:2.5px;left:0;position:absolute;background:linear-gradient(to right,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-ms-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-o-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-moz-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-gradient(linear,left top,right top,color-stop(0,#e0e0e0),color-stop(35%,#e0e0e0),color-stop(65%,#e0e0e0),color-stop(100%,#fff))} .posts-list h2 a:hover:before{background-color:#ff374a} .posts-list h2 a:hover:after{background:linear-gradient(to right,#ff374a 0,#ff374a 35%,#ff374a 65%,#fff 100%);background:-ms-linear-gradient(left,#ff374a 0,#ff374a 35%,#ff374a 65%,#fff 100%);background:-o-linear-gradient(left,#ff374a 0,#ff374a 35%,#ff374a 65%,#fff 100%);background:-webkit-linear-gradient(left,#ff374a 0,#ff374a 35%,#ff374a 65%,#fff 100%);background:-moz-linear-gradient(left,#ff374a 0,#ff374a 35%,#ff374a 65%,#fff 100%);background:-webkit-gradient(linear,left top,right top,color-stop(0,#ff374a),color-stop(35%,#ff374a),color-stop(65%,#ff374a),color-stop(100%,#fff))} /* Post Formats */ .posts-list h2:before{font-family:dashicons;font-weight:400;vertical-align:-3px} .posts-list .format-gallery h2:before{content:"\f161";margin-right:3px} .posts-list .format-link h2:before{content:"\f103"} .posts-list .format-video h2:before{content:"\f236"} .posts-list .format-audio h2:before{content:"\f127"} .posts-list .format-chat h2:before{content:"\f125"} .posts-list .format-aside h2:before{content:"\f499";margin-right:-3px;font-size:24px;vertical-align:sub} /* Post Meta */ .posts-list .post-meta{padding-bottom:5px} .posts-list .post-meta .post-category{color:#718096;font-size:12px} .posts-list .post-meta .post-category a{color:#718096} .posts-list .post-meta .post-mobile-date{display:none} .posts-list .post-meta span:first-child:before,.single .post-meta span:first-child:before{display:none} .posts-list .post-meta span:before,.single .post-meta span:before{content:"";width:10px;height:5px;border-top:1px solid #cecbd2;display:inline-block;margin-right:10px;margin-left:3px} /* Post Thumbnail */ .posts-list .post-time-img{position:relative;margin-right:20px;flex-shrink:0;height:130px;width:130px;overflow:hidden;float:left;border:1px solid #eae8e842;background-color:#eae8e842} .posts-list .post-date{font-size:70px;font-weight:700;text-align:center;width:100%;height:100%;line-height:35px;padding-top:20px;display:flex;flex-direction:column;-webkit-box-align:center;align-items:center;-webkit-box-pack:center;justify-content:center;color:#424242;transition:all .35s ease-in-out 0s} .posts-list .post-date>span{font-size:13px;font-weight:400;display:block;margin-top:12px;text-transform:uppercase} .posts-list .post-preview{position:absolute;width:100%;height:100%;top:0;left:0;transform:translateY(-100%);transition:all .35s ease-in-out 0s} .posts-list .post-preview img{width:100%;height:100%;object-fit:cover} .posts-list .post:hover .post-date{transform:translateY(100%)} .posts-list .post:hover .post-preview{transform:translateY(0)} .posts-list .post:hover .post-time-img.no-thumbnail .post-date{transform:translateY(0)} /* Post Images */ .posts-list .post.cover .post-wrapper{padding:50px 40px;position:relative;z-index:0;display:flex} .posts-list .post.cover .post-wrapper:before{background-color:#000;bottom:0;content:"";left:0;opacity:.4;position:absolute;right:0;top:0;z-index:10} .posts-list .post.cover .entry-wrapper{position:relative;z-index:10} .posts-list .post.cover .entry-wrapper{display:flex;flex-direction:column;justify-content:center} .posts-list .post.cover .entry-wrapper .entry-meta{margin-bottom:8px} .posts-list .post.cover .entry-wrapper h2 a{color:#fff} .posts-list .post.cover .entry-wrapper .meta-category a{color:#fff;font-size:14px} .posts-list .post.cover .post-wrapper .jarallax-container{clip:rect(0 790px 165px 0);clip:rect(0,790px,165px,0);position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:-100} .posts-list .post.cover .jarallax-container img{object-fit:cover;object-position:50% 50%;max-width:none;position:fixed;top:0;left:initial;width:790px;height:100%;overflow:hidden;pointer-events:none} .posts-list .post.cover{width:100%;margin-bottom:25px} .posts-list .post.cover h2{padding-bottom:0} .posts-list .post.cover h2 a:after,.posts-list .post.cover h2 a:before{display:none} /* pagination */ .pagination{border-top:1px solid #e6e6e670;padding-top:38px;margin-top:20px} .pagination .xintheme-loadmore{text-align:center;cursor:pointer} .pagination .xintheme-loadmore svg{width:55px;height:auto} .pagination-loader,.pagination-loader:after,.pagination-loader:before{width:2.5em;height:2.5em;-webkit-animation:loader 1.2s infinite ease-in-out;animation:loader 1.2s infinite ease-in-out;border-radius:50%;-webkit-animation-fill-mode:both;animation-fill-mode:both} .pagination-loader{font-size:7px;position:relative;margin:0 auto 115px;-webkit-transform:translateZ(0);transform:translateZ(0);-webkit-animation-delay:-.16s;animation-delay:-.16s;text-indent:-9999em;color:#dddee6} .pagination-loader:after,.pagination-loader:before{position:absolute;top:0;content:''} .pagination-loader:before{left:-3.5em;-webkit-animation-delay:-.32s;animation-delay:-.32s} .pagination-loader:after{left:3.5em} @keyframes loader { 0%,100% { opacity: 0; box-shadow: 0 2.5em 0 -1.3em } 25% { opacity: 1; box-shadow: 0 2.5em 0 0 } } /* Back Top */ #backtop{display:inline-block;background-color:#ff374a;width:50px;height:50px;text-align:center;border-radius:4px;position:fixed;bottom:30px;right:30px;transition:background-color .3s,opacity .5s,visibility .5s;opacity:0;visibility:hidden;z-index:1000;padding-top:13px} #backtop:hover{cursor:pointer;background-color:#333} #backtop:active{background-color:#555} #backtop.show{opacity:1;visibility:visible} #backtop svg path{fill:#fff} /************************************************************************************** ************** ************** Comments ************** ****************************************************************************************/ .comment-list,.comment-list ol.children,.comment-list>ol{list-style:none;padding-left:0;margin-top:26px;margin-bottom:0} .comment-list{margin:40px 0;padding-top:40px;margin-top:10px} .comment-list blockquote{margin:14px 24px} .comment-list .children{margin-top:19px;margin-bottom:19px} .comment-list .comment-author img{float:left;margin-right:16px;border-radius:3px;margin-top:3px;width:45px;height:45px;background-color:#f5f5f5} .comment-list .comment-meta{font-size:14px;line-height:29px;margin-bottom:4px} .comment-list .comment-metadata{font-size:13px;line-height:29px} .comment-list .comment-metadata a{color:#9a9a9a} .comment-list .comment-metadata a:hover{color:#333} .comment-list .comment-author{float:left;margin-right:9px;height:26px} .comment-list .comment-author a{color:#000} .comment-list .reply{margin-left:58px;margin-top:5px} .comment-list .reply a{font-size:13px;line-height:20px;color:#333;-o-transition:color .15s ease-in;-webkit-transition:color .15s ease-in;-moz-transition:color .15s ease-in;transition:color .15s ease-in;margin-left:15px;letter-spacing:.2px} .comment-list .reply a:focus,.comment-list .reply a:hover{color:#ff374a} .comment-list .comment-awaiting-moderation{display:inline-block;margin-left:61px;margin-top:0;margin-bottom:0;background:#fefac7;font-size:12px;padding:0 5px;border-radius:5px} .comment-list ol.children{padding-left:38px;margin-left:23px;margin-top:0;padding-top:18px} .comment-list ol.children ol.children{padding-left:38px;margin-left:0} .comment-content p{margin-top:0;margin-bottom:8px;font-size:14px;line-height:21px} .comment-content{margin-left:58px;background-color:#f5f5f5;padding:11px 18px 4px;border-radius:5px;position:relative} .comment-reply-title{font-size:18px;border-bottom:1px solid #ececec;padding-bottom:7px;margin-bottom:7px;padding-top:30px;color:#333;font-weight:400} .comment-list .says{display:none} /* .comment-reply-title .cancel-comment-reply-link {} */ .comments-title{font-size:18px;border-bottom:1px solid #ececec;padding-bottom:10px;margin-bottom:7px} .comment-list .comment-respond{margin-left:58px} .comment-list .comment{margin-bottom:24px;padding-bottom:12px} .comment-list .comment:last-child{border-bottom:0} .comment-list .reply a .comments_reply_icon{margin-right:3px;color:#e2e2e2;-o-transition:color .15s ease-in;-webkit-transition:color .15s ease-in;-moz-transition:color .15s ease-in;transition:color .15s ease-in} .comment-list .reply a .comments_reply_icon svg{vertical-align:-2px} .comment-list .reply a .comments_reply_icon svg path{fill:#999999} .comment-list .reply a:hover .comments_reply_icon svg path{fill:#ff374a} .comment-list .reply a:hover .comments_reply_icon{margin-right:5px;color:#ff374a} .comment-list .comment:last-child{margin-bottom:0} .comment-list .children .comment{margin-bottom:22px;padding-bottom:0;border-bottom:0} .comment-list .children .comment:last-child{margin-bottom:0} .comment-list .pingback{font-size:14px;margin-bottom:20px;line-height:1.8em;color:#000} .comments-area .no-comments{font-size:16px;margin-top:42px;color:#0a0a0a;font-style:italic} .comment-form .row,form.comment-form{margin-left:-5px;margin-right:-5px} form.comment-form .logged-in-as{padding-left:5px;padding-right:5px;font-weight:400;font-size:14px;margin-top:0;margin-bottom:10px;color:grey} form.comment-form .col12,form.comment-form .col4,form.comment-form .col6,form.comment-form .col8,form.comment-form .form-submit{padding-left:5px;padding-right:5px} form.comment-form .form-submit{position:relative;min-height:1px;float:left;margin-top:0;margin-bottom:0;width:33.33333333%} body.logged-in form.comment-form .form-submit{width:auto} form.comment-form .form-submit input{width:100%;height:38px;padding:0 30px;font-size:13px;background-color:#222;color:#fff;-o-transition:all .15s ease-in;-webkit-transition:all .15s ease-in;-moz-transition:all .15s ease-in;transition:all .15s ease-in;border-bottom:1px solid #eaeaea;margin-top:0} form.comment-form .form-submit input:hover{background-color:#ff374a;color:#fff} form.comment-form:after,form.comment-form:before{content:" ";display:table} form.comment-form:after{clear:both} form.comment-form .comment-notes{font-size:13px;margin-bottom:25px;color:grey} .comment_textarea_wrapper{position:relative} .comment_textarea_wrapper textarea{width:100%;background-color:#fff;border:2px solid #ececec;border-radius:4px;height:96px;font-size:14px;line-height:24px;padding-left:76px;padding-top:16px;padding-right:16px} .comment_textarea_wrapper img{position:absolute;left:21px;top:16px;border-radius:2px;width:45px;height:45px;background-color:#f5f5f5} form.comment-form .comment_details_wrapper input{background-color:#fff;border-radius:4px;height:39px;font-size:13px;padding-left:10px;width:100%;line-height:24px;border:2px solid #ececec} .comment-list .comment.bypostauthor .comment-content{border-top-left-radius:0} .comment-list .comment.bypostauthor .comment-content:before{content:"";width:14px;height:14px;border-top:7px solid #ff374a;border-left:7px solid #ff374a;border-right:7px solid transparent;border-bottom:7px solid transparent;position:absolute;top:0;left:0} /*.comment-notes{display:none} .form-allowed-tags{display:none}*/ .comments-area a{color:#222} .comments-area a:hover{color:#ff374a} .blog_list_comment_link{float:right;margin-left:20px;margin-top:2px} .blog_list_comment_link a{font-size:16.5px;color:#585858;font-weight:400;vertical-align:top;line-height:22px;display:inline-block} .blog_list_comment_link a:hover{color:#222} .blog_list_comment_link a .comment_num{margin-left:5px;vertical-align:top;display:inline-block;line-height:18px;font-weight:700;color:#333} .comment-form-cookies-consent{margin-bottom:7px;line-height:18px} .comment-form-cookies-consent label{font-weight:400;font-size:12px;color:#424242;line-height:18px} #wp-comment-cookies-consent{vertical-align:-2px;margin-right:3px} /* social-share/tooltip */ #social-share{margin-left:15px;float:right} #social-share span{cursor:pointer} #social-share svg{vertical-align:-3px} #social-share svg path{fill:#cccccc} #social-share i{margin-right:5px} #social{display:none} #social ul{text-align:center;margin:0 auto;width:100%;height:60px;background-color:#FAFAFA} #social ul li i{font-size:25px;line-height:63px;text-align:center;color:#888;cursor:pointer} #social ul li{display:inline-table;width:70px} a[data-tooltip]{position:relative} a[data-tooltip]::before,a[data-tooltip]::after{position:absolute;display:none;opacity:0.85} a[data-tooltip]::before{content:attr(data-tooltip);background:rgba(0,0,0,0.8);color:#fff;font-size:14px;padding:5px 10px;border-radius:3px;white-space:nowrap;text-decoration:none} a[data-tooltip]::after{width:0;height:0;border:6px solid transparent;content:''} a[data-tooltip]:hover::before,a[data-tooltip]:hover::after{display:block} a[data-tooltip][data-placement="top"]::before{bottom:100%;left:-16px;margin-bottom:16px} a[data-tooltip][data-placement="top"]::after{border-top-color:rgba(0,0,0,0.8);border-bottom:none;bottom:100%;left:7px;margin-bottom:10px} /* links */ .linkpage h5{display:none} .linkpage ul{list-style-type:none} .linkpage ul li ul li{float:left;height:30px;list-style-type:none;text-align:center;margin:15px 0} .linkpage ul li ul li a{text-align: center;color: #666666;display:block;text-decoration:none;float:left;overflow:hidden;width:230px;border:1px #93C98C solid;padding:8px 10px;border-radius:8px;margin:0 8px} .linkpage ul li ul li :hover{background:#8CC9AD;color:#fff} /* chat */ .chatbox{display:block;padding:10px 0px;letter-spacing:1px} .chatbox strong{display:none} .chat_content .bub{display:block;max-width:600px;padding:10px 20px} section.left .bub{float:left} section.right .bub{float:right} .chatbox .left .chat-arrow{width:0;height:0;display:block;float:left;margin-top:5px;border-left:20px solid transparent} .chatbox .right .chat-arrow{width:0;height:0;display:block;float:right;margin-top:5px;border-right:20px solid transparent} /* chat_green */ .chatbox .green .bub{border:2px solid #93D3B6;color:#fff;background:#93D3B6} .chatbox .green .chat-arrow{border-bottom:20px solid #93D3B6} /* chat_red */ .chatbox .red .bub{border:2px solid #d57976;color:#fff;background:#d57976} .chatbox .red .chat-arrow{border-bottom:20px solid #d57976} .left{float:left} .right{float:right} .cf:before,.cf:after{content:"";display:table} .cf:after{clear:both} .cf{zoom:1} /** --------------------------------------------------------------------------------- * * Side Container * --------------------------------------------------------------------------------- */ html.side_container_opened{overflow:hidden} .site_side_container{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;position:fixed;width:341px;height:100%;background-color:#fff;border-left:1px solid #e7e7e7;box-shadow:-1px 0 35px 7px transparent;right:-341px;top:0;-o-transition:transform .3s ease-out;-webkit-transition:transform .3s ease-out;-moz-transition:transform .3s ease-out;transition:transform .3s ease-out;z-index:999999;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000;-moz-perspective:1000;-ms-perspective:1000;perspective:1000} body.admin-bar .site_side_container{top:32px} .side_container_opened .site_side_container{-moz-transform:translate(-100%);-ms-transform:translate(-100%);-o-transform:translate(-100%);-webkit-transform:translate(-100%);transform:translate(-100%);box-shadow:-1px 0 35px 7px rgba(0,0,0,.06)} #page,.site_main_container{-o-transition:transform .35s ease-out;-webkit-transition:transform .35s ease-out;-moz-transition:transform .35s ease-out;transition:transform .35s ease-out} .side_container_opened .site_main_container{-moz-transform:translate(-80px);-ms-transform:translate(-80px);-o-transform:translate(-80px);-webkit-transform:translate(-80px);transform:translate(-80px);right:0} .sticky_header_nav_wrapper{-o-transition:all .35s ease-out,top .35s ease-out,border .2s ease-in;-webkit-transition:all .35s ease-out,top .35s ease-out,border .2s ease-in;-moz-transition:all .35s ease-out,top .35s ease-out,border .2s ease-in;transition:all .35s ease-out,top .35s ease-out,border .2s ease-in} .footer_static_bar{-o-transition:transform .35s ease-out,bottom .35s ease-out;-webkit-transition:transform .35s ease-out,bottom .35s ease-out;-moz-transition:transform .35s ease-out,bottom .35s ease-out;transition:transform .35s ease-out,bottom .35s ease-out} .side_container_opened .footer_static_bar,.side_container_opened .sticky_header_nav_wrapper{-moz-transform:translate(-80px);-ms-transform:translate(-80px);-o-transform:translate(-80px);-webkit-transform:translate(-80px);transform:translate(-80px);right:0} html.modal_open .footer_static_bar{bottom:-130px} .sliding_close_helper_overlay{display:none;position:fixed;cursor:url(static/icon/cursor-white.png), auto;width:100%;height:100%;top:0;left:0;margin-left:0;background-color:#f5f8fa;opacity:.3} body.side_container_opened .sliding_close_helper_overlay{display:block} body.side_container_opened{overflow:hidden} .site_side_container .info_sidebar{padding:26px 30px} body.admin-bar .site_side_container .info_sidebar{padding-bottom:58px} .site_side_container .top_header_items_holder{display:none} /** --------------------------------------------------------------------------------- * * Widget Style * --------------------------------------------------------------------------------- */ .widget_title{color:#666;line-height:1.5em;font-weight:bold} .widget_content{margin-bottom:24px;font-size:14px;color:#777;line-height:1.6em} .intro_widgets_container .widget_content{font-size:16px;line-height:1.65em;color:#222;margin-bottom:16px} .intro_widgets_container .widget_content:last-child{margin-bottom:0} .site_side_container .widget_content{font-size:14px;line-height:1.5em} .widget_content ul{list-style:none;padding:0;margin:0} .widget_content ul li{margin-bottom:11px;line-height:21px} .widget_content ul li a{color:#444;font-size:14px} .widget_content.widget_archive ul li a,.widget_content.widget_categories ul li a{font-weight:400;font-size:13px} .widget_content ul li a:hover{color:#ff374a} .widget_content ul li:last-child{margin-bottom:0} .widget_container:not(.intro_widget_content) .widget_content.widget_nav_menu ul{list-style:initial;padding-left:18px} .widget_content.widget_rss ul li{margin-bottom:24px} .widget_content.widget_rss ul li:last-child{margin-bottom:0} .widget_container .widget_title{font-size:16px;position:relative;margin-bottom:23px;padding-bottom:10px} .default_widgets_container .widget_container .widget_title{font-size:14px} .default_widgets_container .widget_search input.search_submit{display:none} .site_side_container .widget_search input.search_submit{display:none} .default_widgets_container .widget_calendar{margin:initial} .widget_container.alia-social-widget .widget_title,.widget_container.widget_text .widget_title{margin-bottom:16px} /*.widget_container .widget_title:before{content:"";background-color:#666;width:6px;height:6px;border-radius:50%;left:0;bottom:0;z-index:1;position:absolute}*/ .widget_container .widget_title:after{content:"";width:80px;height:1px;bottom:2px;left:0;position:absolute;background:linear-gradient(to right,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-ms-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-o-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-moz-linear-gradient(left,#e0e0e0 0,#e0e0e0 35%,#e0e0e0 65%,#fff 100%);background:-webkit-gradient(linear,left top,right top,color-stop(0,#e0e0e0),color-stop(35%,#e0e0e0),color-stop(65%,#e0e0e0),color-stop(100%,#fff))} .widget_content p{margin-bottom:10px} /* Tag Cloud Widget */ .tagcloud a{display:block;float:left;line-height:22px;margin-right:14px;margin-bottom:6px;font-size:14px!important;-o-transition:all .1s ease-in;-webkit-transition:all .1s ease-in;-moz-transition:all .1s ease-in;transition:all .1s ease-in;color:#212121;border-bottom:1px dashed #b5b5b5} .tagcloud a:hover{color:#ff374a;border-bottom-color:#333} .single_tagcloud{margin-top:30px;margin-bottom:16px;clear:both} /* Search Widget */ .widget_search .search-form{display:flex} .widget_search .search-field{resize:none;margin-top:0;margin-bottom:0;max-width:100%;padding:10px 12px;font-size:13px;color:#666;line-height:1.6em;width:266px;font-family:inherit;background-color:#fff;border:2px solid #ececec;border-radius:4px} /* Calendar Widget */ .widget_calendar table{width:100%;border-top:none} .widget_calendar table a:hover{border-bottom:none} .widget_calendar table tr{border-bottom:none} .widget_calendar table td,.widget_calendar table th{border-left:none} .widget_calendar table td:last-child,.widget_calendar table th:last-child{border-right:none;padding:0} .widget_calendar{width:100%;max-width:280px} #wp-calendar{width:100%} #wp-calendar thead{font-size:10px} #wp-calendar thead th{padding:6px 0;background-color:#ededed;text-align:center;color:#000;font-weight:700;font-size:12px;border-right:2px solid #fff;border-bottom:2px solid #ddd} #wp-calendar thead th:last-child{border-right:0} #wp-calendar tbody{color:#aaa} #wp-calendar tbody td{background-color:#f5f5f5;border-right:2px solid #fff;text-align:center;padding:7px;font-weight:300;color:#888} #wp-calendar tbody td:last-child{border-right:0} #wp-calendar tbody td:hover{background-color:#fff} #wp-calendar tbody td.pad{border-color:transparent} #wp-calendar tbody tr:first-child td.pad{border-right:2px solid #fff} #wp-calendar tbody td.pad:hover{background-color:transparent} #wp-calendar tbody .pad{background:0 0} #wp-calendar tfoot #next{font-size:10px;text-transform:uppercase;padding:0;text-align:right} #wp-calendar tfoot #prev{font-size:10px;text-transform:uppercase;padding:0;padding-top:10px} #wp-calendar tbody td a{font-weight:800} .widget_container caption{text-align:left;font-size:13px;text-transform:uppercase;font-weight:400;margin-top:0;margin-bottom:12px;color:#2f2f2f;border-radius:4px} /* Mobile Menu */ ul.navbar>li.menu-item>a{padding:5px 0;display:block;font-size:15px} ul.navbar>li.menu-item>.dropdown-menu{float:none;position:initial;border:none;margin-left:0;margin-top:8px;margin-bottom:8px;background-color:#f5f5f5} ul.navbar>li.menu-item .dropdown-menu>li>a{display:block;margin:0 18px;padding:11px 0;clear:both;font-weight:400;line-height:1.528571;font-size:12.5px;letter-spacing:.4px;border-bottom:1px dashed #e0e0e0;text-transform:initial} ul.navbar>li.menu-item .dropdown-menu>li:last-child>a,ul.navbar>li:last-child{border-bottom:none} ul.navbar>li{border-bottom:1px solid #cccccc47;padding-bottom:5px;margin-bottom:5px} .dropdown-menu{display:none;position:absolute;top:100%;left:12px;z-index:1000;float:left;min-width:160px;padding:0;text-align:left;background-color:#fff;-webkit-background-clip:padding-box;background-clip:padding-box;border:1px solid #f0f0f0} .mobile_dropdown_arrow{display:inline-block;float:right;width:36px;text-align:center;height:36px;line-height:36px;margin-top:-7px;margin-right:-11px} .mobile_dropdown_arrow svg{vertical-align:middle} .mobile_dropdown_arrow svg path{fill:#ccc!important} .dropdown-toggle.mobile_menu_opened .mobile_dropdown_arrow svg{transform:rotate(180deg);-ms-transform:rotate(180deg);-moz-transform:rotate(180deg);-webkit-transform:rotate(180deg);-o-transform:rotate(180deg)} /** --------------------------------------------------------------------------------- * * 爱心挂件 * --------------------------------------------------------------------------------- */ #dahuzi_love{position:absolute;top:0;bottom:0;width:100%;height:100%;right:-410px} #dahuzi_love .dahuzi_love_inner{background:url(static/icon/splash-bg.png) no-repeat center;-webkit-background-size:contain;background-size:contain} #dahuzi_love .dahuzi_love_inner{position:relative;top:200px;width:200px;margin:auto;z-index:3;padding:20px 0;text-align:center} #dahuzi_love .dahuzi_love_hearts{background:url(static/icon/hearts.png) no-repeat center;background-size:contain} #dahuzi_love .dahuzi_love_hearts{width:75px;height:75px;margin-right:auto;margin-left:auto;display:table;-webkit-animation:dahuzi_love_hearts 5s infinite linear;animation:dahuzi_love_hearts 5s infinite linear;margin-top:15px} @keyframes dahuzi_love_hearts { 0% { transform: rotate(-15deg); transform-origin: center } 50% { transform: rotate(15deg); transform-origin: center } 100% { transform: rotate(-15deg); transform-origin: center } } #dahuzi_love .dahuzi_love_date{padding:0;margin:0;font-size:12px;color:#ec365a;margin-bottom:30px} #dahuzi_love .dahuzi_love_couple_ini{display:table-cell;vertical-align:middle;text-indent:-1em;color:#fff;font-family:cursive} #dahuzi_love .dahuzi_love_text{font-size:12px;color:#ec365a;margin:0} /** --------------------------------------------------------------------------------- * * 手机端优化 * --------------------------------------------------------------------------------- */ @media screen and (max-width:719px){ header nav{display:none} header{top:20px} .header_sliding_sidebar_control{margin-left:auto} .header_sliding_sidebar_control svg{width:30px;height:30px} .header_sliding_sidebar_control svg path{fill:#ffffffc2 !important} .hero{height:100%} .header-banner{overflow:hidden;margin-bottom:10px} #dahuzi_love{display:none} header #logo img{height:30px} .posts-list{margin-bottom:30px} .posts-list .post-status,.posts-list .post-time-img{display:none} .posts-list .post-content{width:100%} .posts-list>li~li{padding-top:20px;margin-top:0} .posts-list p{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2} .posts-list .post-meta .post-mobile-date{color:#718096;font-size:12px;margin-left:5px;display:inline-block} .posts-list .post.cover .post-wrapper{padding:30px} .posts-list .post.cover .jarallax-container img{position:initial;width:100%} .pagination{padding-top:20px;margin-top:0;margin-bottom:0} #backtop{width:30px;height:30px;right:5px;padding-top:6px} #backtop svg{width:20px;height:20px} .site_side_container .top_header_items_holder{display:block} .footer{font-size:14px;padding:60px 0} .single .single_tag{width:100%;margin-bottom:30px} .single .slide{float:left} } /* 文章页整体：参考 NDC 的克制、留白、设计感 -----------------*/ .wrapper { max-width: 1120px; margin: 0 auto; padding: 120px 24px 80px; } /* 文章主体不要满屏，收窄后才高级 */ .wrapper article { max-width: 760px; margin: 0 auto; } /* 标题 */ .post-title { margin: 0 0 28px; font-family: "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; font-size: clamp(36px, 6vw, 72px); line-height: 1.05; font-weight: 400; letter-spacing: -0.04em; color: #111; } /* 分类、时间 */ .post-meta { display: flex; gap: 18px; align-items: center; margin-bottom: 88px; font-size: 13px; line-height: 1.6; color: #777; letter-spacing: 0.02em; } .post-meta a { color: #111; text-decoration: none; border-bottom: 1px solid rgba(0,0,0,.25); } /* 正文 */ .post-body { font-family: "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; font-size: 18px; line-height: 2.05; font-weight: 400; color: #222; letter-spacing: 0.01em; } /* 段落间距 */ .post-body p { margin: 0 0 1.6em; } /* 二级标题：不要太像传统博客标题 */ .post-body h2 { margin: 96px 0 28px; font-size: clamp(28px, 4vw, 48px); line-height: 1.15; font-weight: 400; letter-spacing: -0.035em; color: #111; } /* 加粗文字不要太黑太粗 */ .post-body strong { font-weight: 500; color: #111; } /* 链接 */ .post-body a { color: #111; text-decoration: none; border-bottom: 1px solid rgba(0,0,0,.28); } .post-body a:hover { border-bottom-color: #111; } /* 列表 */ .post-body ul, .post-body ol { margin: 0 0 2em; padding-left: 1.3em; } .post-body li { margin: 0.45em 0; } /* 图片 */ .post-body figure { margin: 72px 0; } .post-body figure img, .post-body img { display: block; width: 100%; height: auto; border-radius: 0; } /* 图片说明 */ .post-body figure + p { margin-top: -48px; font-size: 14px; line-height: 1.8; color: #777; } /* 底部评论/分享区域弱化 */ .meta.split { max-width: 760px; margin: 96px auto 0; padding-top: 32px; border-top: 1px solid #e5e5e5; color: #999; } /* 移动端 */ @media (max-width: 768px) { .wrapper { padding: 88px 20px 56px; } .post-title { font-size: 42px; line-height: 1.08; } .post-meta { margin-bottom: 56px; font-size: 12px; } .post-body { font-size: 17px; line-height: 2; } .post-body h2 { margin-top: 72px; font-size: 30px; } .post-body figure { margin: 52px 0; } } /* ---------------------------------------------------------------------------- */ /* ========================================================= NDC Theme Unified Styles ========================================================= */ /* ---------- Base Variables ---------- */ :root { --ndc-bg: #f7f5f0; --ndc-hero-bg: #ebe7df; --ndc-panel: #fffaf2; --ndc-text: #111; --ndc-muted: #777; --ndc-line: rgba(0,0,0,.12); } body { background: var(--ndc-bg); color: var(--ndc-text); font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; } a, button, .sliding_sidebar_button, #user_control_icon, .ndc-menu-button, .ndc-main-nav a, .site_side_container a, .ndc-search-trigger, .ndc-search-close { cursor: pointer !important; } input, textarea { cursor: text !important; } /* ========================================================= Header ========================================================= */ .ndc-site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 999; background: rgba(247,245,240,.97); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border-bottom: 1px solid rgba(0,0,0,.08); } body.admin-bar .ndc-site-header { top: 32px; } .ndc-header-container { max-width: 1180px !important; width: 100% !important; height: 74px !important; margin: 0 auto !important; padding: 0 42px !important; display: grid !important; grid-template-columns: auto 1fr auto !important; align-items: center !important; gap: 42px !important; box-sizing: border-box !important; } .ndc-logo, #logo { grid-column: 1 !important; height: 74px !important; display: flex !important; align-items: center !important; justify-content: flex-start !important; color: #111 !important; text-decoration: none !important; white-space: nowrap; line-height: 1 !important; min-width: 0 !important; } .ndc-logo img, #logo img { display: block !important; max-height: 34px !important; width: auto !important; object-fit: contain !important; filter: brightness(0) !important; opacity: 1 !important; margin: 0 !important; } .site-title { margin: 0 !important; padding: 0 !important; font-size: 20px !important; line-height: 1 !important; font-weight: 600 !important; letter-spacing: .02em; color: #111 !important; display: flex !important; align-items: center !important; } .ndc-main-nav { grid-column: 2 !important; justify-self: end !important; min-width: 0; } .ndc-main-nav .ndc-menu { display: flex; align-items: center; justify-content: flex-end; gap: 6px; margin: 0; padding: 0; list-style: none; } .ndc-main-nav .ndc-menu > li { margin: 0; padding: 0; list-style: none; } .ndc-main-nav .ndc-menu > li > a { position: relative; display: flex; align-items: center; height: 74px; padding: 0 14px; font-size: 15px; line-height: 1; font-weight: 500; color: #3f3a34; text-decoration: none; letter-spacing: .015em; transition: color .25s ease; } .ndc-main-nav .ndc-menu > li > a::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 23px; height: 1px; background: rgba(0,0,0,.72); transform: scaleX(0); transform-origin: right; transition: transform .28s ease; } .ndc-main-nav .ndc-menu > li > a:hover, .ndc-main-nav .ndc-menu > li.current-menu-item > a, .ndc-main-nav .ndc-menu > li.current_page_item > a { color: #111; } .ndc-main-nav .ndc-menu > li > a:hover::after, .ndc-main-nav .ndc-menu > li.current-menu-item > a::after, .ndc-main-nav .ndc-menu > li.current_page_item > a::after { transform: scaleX(1); transform-origin: left; } .ndc-header-actions { grid-column: 3 !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; justify-self: end !important; gap: 10px !important; min-width: max-content !important; } .ndc-search-trigger, .ndc-menu-button { width: 40px; height: 40px; border: 1px solid rgba(0,0,0,.16); border-radius: 999px; background: transparent; flex: 0 0 auto; } .ndc-search-trigger { display: flex; align-items: center; justify-content: center; padding: 0; transition: background .25s ease, transform .25s ease; } .ndc-search-trigger:hover { background: rgba(0,0,0,.045); transform: scale(.96); } .ndc-search-trigger svg { width: 18px; height: 18px; stroke: #111; fill: none; stroke-width: 1.7; stroke-linecap: round; } .ndc-mobile-control { display: none; } .ndc-menu-button { display: flex !important; align-items: center !important; justify-content: center !important; flex-direction: column; gap: 6px; text-decoration: none !important; } .ndc-menu-button span { width: 17px; height: 1px; background: #111; display: block; } /* ========================================================= Search Overlay ========================================================= */ .ndc-search-overlay { position: fixed; inset: 0; z-index: 2000; background: radial-gradient(circle at 20% 10%, rgba(0,0,0,.06), transparent 28%), rgba(247,245,240,.98); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity .28s ease; } .ndc-search-overlay.active { opacity: 1; pointer-events: auto; } .ndc-search-close { position: absolute; top: 34px; right: 42px; width: 44px; height: 44px; border: 1px solid rgba(0,0,0,.14); border-radius: 999px; background: transparent; padding: 0; margin: 0; display: flex; align-items: center; justify-content: center; } body.admin-bar .ndc-search-close { top: 66px; } .ndc-search-close span { position: absolute; width: 16px; height: 1px; background: #111; display: block; } .ndc-search-close span:first-child { transform: rotate(45deg); } .ndc-search-close span:last-child { transform: rotate(-45deg); } .ndc-search-inner { width: min(720px, calc(100% - 44px)); } .ndc-search-kicker { margin-bottom: 22px; font-size: 13px; letter-spacing: .12em; color: #777; text-transform: uppercase; } .ndc-search-inner form { display: grid; grid-template-columns: 1fr auto; gap: 22px; align-items: end; border-bottom: 1px solid rgba(0,0,0,.22); padding-bottom: 18px; } .ndc-search-inner input { width: 100%; border: none; outline: none; background: transparent; font-size: clamp(26px, 5vw, 54px); line-height: 1.15; font-weight: 400; letter-spacing: -.045em; color: #111; } .ndc-search-inner input::placeholder { color: rgba(0,0,0,.28); } .ndc-search-inner button[type="submit"] { border: none; background: #111; color: #f7f5f0; border-radius: 999px; padding: 12px 22px; font-size: 14px; line-height: 1; white-space: nowrap; } /* ========================================================= Common Hero ========================================================= */ .ndc-home-page, .ndc-article-page, .ndc-archive-page, .ndc-list-page { background: var(--ndc-bg); } .ndc-article-hero, .ndc-home-hero, .ndc-archive-hero, .ndc-list-hero { padding-top: 182px !important; } body.admin-bar .ndc-article-hero, body.admin-bar .ndc-home-hero, body.admin-bar .ndc-archive-hero, body.admin-bar .ndc-list-hero { padding-top: 214px !important; } .header-banner { margin-top: 74px; } body.admin-bar .header-banner { margin-top: 106px; } .ndc-home-hero, .ndc-list-hero { padding: 100px 42px 92px; background: radial-gradient(circle at 78% 22%, rgba(0,0,0,.075), transparent 26%), linear-gradient(135deg, #f4f0e7 0%, #ebe7df 52%, #ded8cd 100%); border-bottom: 1px solid rgba(0,0,0,.1); } .ndc-home-inner { max-width: 1240px; margin: 0 auto; min-height: 520px; display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 80px; align-items: end; } .ndc-hero-text { padding-bottom: 18px; } .ndc-kicker { font-size: 13px; letter-spacing: .1em; color: var(--ndc-muted); margin-bottom: 30px; } .ndc-home-title { margin: 0; max-width: 980px; font-size: clamp(62px, 8.5vw, 126px); line-height: 1.02; font-weight: 400; letter-spacing: -.07em; color: #111; } .ndc-home-lead { max-width: 640px; margin: 46px 0 0 auto; font-size: clamp(18px, 2vw, 25px); line-height: 1.75; font-weight: 300; color: #333; } .ndc-hero-card { align-self: end; padding: 28px 30px 30px; background: rgba(255,250,242,.62); border: 1px solid rgba(0,0,0,.12); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); } .ndc-hero-card span { display: block; margin-bottom: 46px; font-size: 12px; color: #777; letter-spacing: .1em; } .ndc-hero-card strong { display: block; font-size: 22px; line-height: 1.35; font-weight: 400; letter-spacing: -.02em; color: #111; } .ndc-hero-card p { margin: 28px 0 0; font-size: 13px; line-height: 1.8; color: #666; } /* ========================================================= Article List ========================================================= */ .ndc-posts-wrap { max-width: 1180px; margin: 0 auto; padding: 88px 42px 140px; background: var(--ndc-bg); } .ndc-posts-head { display: flex; justify-content: space-between; gap: 24px; padding-bottom: 18px; border-bottom: 1px solid var(--ndc-line); font-size: 13px; color: var(--ndc-muted); letter-spacing: .04em; } .ndc-posts-list { list-style: none; margin: 0; padding: 0; } .ndc-post-item { border-bottom: 1px solid var(--ndc-line); } .ndc-post-link { display: grid; grid-template-columns: 160px minmax(0, 1fr) 220px; gap: 56px; padding: 54px 0; color: inherit; text-decoration: none; } .ndc-post-link:has(.ndc-post-no-thumb) { grid-template-columns: 160px minmax(0, 1fr); } .ndc-post-link:has(.ndc-post-no-thumb) .ndc-post-thumb { display: none; } .ndc-post-date { font-size: 13px; line-height: 1.8; color: var(--ndc-muted); padding-top: 8px; } .ndc-post-main { min-width: 0; } .ndc-post-category { font-size: 13px; color: var(--ndc-muted); letter-spacing: .04em; margin-bottom: 18px; } .ndc-post-title { margin: 0; font-size: clamp(30px, 4vw, 54px); line-height: 1.16; font-weight: 400; letter-spacing: -.05em; color: #111; transition: color .25s ease; } .ndc-post-excerpt { max-width: 680px; margin: 24px 0 0; font-size: 16px; line-height: 1.9; color: #444; } .ndc-post-thumb { aspect-ratio: 4 / 3; overflow: hidden; background: rgba(0,0,0,.04); } .ndc-post-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; } .ndc-post-no-thumb { display: none; } .ndc-post-link:hover .ndc-post-title { color: #555; } .ndc-post-link:hover .ndc-post-thumb img { transform: scale(1.04); } .ndc-empty { padding: 72px 0; border-bottom: 1px solid var(--ndc-line); font-size: 15px; color: var(--ndc-muted); } /* ========================================================= Single Article ========================================================= */ .ndc-article-hero { min-height: 76vh; padding: 120px 42px 90px; display: grid; grid-template-columns: 1fr minmax(320px, 980px) 1fr; align-items: center; } .ndc-hero-inner { grid-column: 2; } .ndc-article-title { margin: 0; max-width: 980px; font-size: clamp(48px, 7.5vw, 108px); line-height: 1.02; font-weight: 400; letter-spacing: -.065em; color: #111; } .ndc-article-lead { max-width: 640px; margin: 40px 0 0 auto; font-size: clamp(18px, 2vw, 25px); line-height: 1.75; font-weight: 300; color: #333; } .ndc-hero-meta { margin-top: 72px; display: flex; flex-wrap: wrap; gap: 12px; font-size: 13px; line-height: 1.7; color: var(--ndc-muted); } .ndc-keywords { gap: 22px; } .ndc-keywords a { color: #555; font-size: 13px; line-height: 1.8; text-decoration: none; letter-spacing: .03em; border-bottom: 1px solid rgba(0,0,0,.22); } .ndc-keywords a::before { content: "#"; margin-right: 4px; color: #aaa; } .ndc-cover { width: calc(100% - 84px); max-width: 1320px; margin: 0 auto 140px; } .ndc-cover img { display: block; width: 100%; height: auto; } .ndc-article-layout { max-width: 1180px; margin: 0 auto; padding: 0 42px 140px; display: grid; grid-template-columns: 240px minmax(0, 720px); gap: 100px; background-color: #fff; font-family: "PingFangSC-Light", sans-serif; } .ndc-mobile-article-info { display: none; } .ndc-article-aside { position: sticky; top: 60px; height: fit-content; font-size: 13px; line-height: 1.9; color: var(--ndc-muted); } .ndc-side-block { padding-top: 18px; margin-bottom: 42px; border-top: 1px solid var(--ndc-line); } .ndc-side-block strong { display: block; margin-bottom: 18px; color: #111; font-weight: 400; letter-spacing: .02em; } .ndc-side-info div { margin-bottom: 2px; } .ndc-article-aside a { color: inherit; text-decoration: none; border-bottom: none; } .ndc-side-list { list-style: none; margin: 0; padding: 0; counter-reset: hot-counter; } .ndc-side-list li { position: relative; counter-increment: hot-counter; padding: 0 0 12px 24px; margin-bottom: 12px; border-bottom: 1px solid rgba(0,0,0,.06); line-height: 1.65; } .ndc-side-list li::before { content: counter(hot-counter); position: absolute; left: 0; top: 0; color: #aaa; font-size: 12px; } .ndc-side-list a { color: #555; transition: color .25s ease; } .ndc-side-list a:hover { color: #111; } .ndc-side-empty { margin: 0; color: #aaa; font-size: 13px; } .ndc-tag-cloud { display: flex; flex-wrap: wrap; gap: 10px 14px; line-height: 1.7; } .ndc-tag-cloud a { color: #555; font-size: 13px !important; text-decoration: none; border-bottom: 1px solid rgba(0,0,0,.16); } .ndc-tag-cloud a::before { content: "#"; margin-right: 3px; color: #aaa; } .ndc-tag-cloud a:hover { color: #111; border-bottom-color: #111; } .ndc-article-body { font-size: 18px; line-height: 2.12; letter-spacing: .01em; color: #222; } .ndc-article-body p { margin: 0 0 1.65em; } .ndc-article-body h2, .ndc-article-body .wp-block-heading { margin: 110px 0 34px; font-size: clamp(34px, 4.8vw, 64px); line-height: 1.08; font-weight: 400; letter-spacing: -.055em; color: #111; } .ndc-article-body h3 { margin: 70px 0 24px; font-size: 28px; line-height: 1.3; font-weight: 400; color: #111; } .ndc-article-body strong { font-weight: 500; color: #111; } .ndc-article-body a { color: #111; text-decoration: none; border-bottom: 1px solid rgba(0,0,0,.28); } .ndc-article-body ul, .ndc-article-body ol { margin: 0 0 2em; padding-left: 1.25em; } .ndc-article-body li { margin: .5em 0; } .ndc-article-body figure { margin: 82px 0; } .ndc-article-body img { display: block; width: 100%; height: auto; } .ndc-article-footer { margin-top: 120px; padding-top: 38px; border-top: 1px solid var(--ndc-line); font-size: 13px; color: var(--ndc-muted); display: flex; align-items: center; justify-content: space-between; gap: 24px; } .ndc-article-footer a { color: #555; text-decoration: none; border-bottom: 1px solid rgba(0,0,0,.18); } .ndc-comment-btn { cursor: pointer; color: #555; } /* ========================================================= Table ========================================================= */ .ndc-article-body .wp-block-table { width: 100%; max-width: 100%; margin: 56px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; } .ndc-article-body table { width: 100%; max-width: 100%; border-collapse: collapse; margin: 48px 0; font-size: 15px; line-height: 1.8; color: #222; background: rgba(255,255,255,.32); border-top: 1px solid rgba(0,0,0,.16); border-bottom: 1px solid rgba(0,0,0,.16); } .ndc-article-body .wp-block-table table { margin: 0; } .ndc-article-body thead, .ndc-article-body .wp-block-table thead { background: rgba(0,0,0,.04); } .ndc-article-body th, .ndc-article-body td, .ndc-article-body .wp-block-table th, .ndc-article-body .wp-block-table td { padding: 16px 18px; text-align: left; vertical-align: top; border-bottom: 1px solid rgba(0,0,0,.1); border-left: none; border-right: none; word-break: normal; overflow-wrap: normal; } .ndc-article-body th, .ndc-article-body .wp-block-table th { font-weight: 500; color: #111; white-space: nowrap; } .ndc-article-body tr:last-child td, .ndc-article-body .wp-block-table tr:last-child td { border-bottom: none; } .ndc-article-body tbody tr:hover, .ndc-article-body .wp-block-table tbody tr:hover { background: rgba(0,0,0,.025); } .ndc-article-body .wp-block-table figcaption { margin-top: 12px; font-size: 13px; line-height: 1.7; color: var(--ndc-muted); text-align: left; } /* ========================================================= Footer ========================================================= */ .ndc-footer { background: radial-gradient(circle at 12% 0%, rgba(255,255,255,.08), transparent 30%), linear-gradient(135deg, #111 0%, #181818 58%, #0d0d0d 100%); color: #f7f5f0; margin-top: 0; } .ndc-footer-inner { max-width: 1180px; margin: 0 auto; padding: 84px 42px 38px; } .ndc-footer-main { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 90px; padding-bottom: 64px; border-bottom: 1px solid rgba(255,255,255,.12); } .ndc-footer-kicker { margin-bottom: 16px; font-size: 12px; line-height: 1.6; color: rgba(255,255,255,.48); letter-spacing: .14em; text-transform: uppercase; } .ndc-footer-title { font-size: clamp(34px, 4.6vw, 56px); line-height: 1.12; font-weight: 400; letter-spacing: -.045em; color: #f7f5f0; } .ndc-footer-desc { max-width: 560px; margin: 28px 0 0; font-size: 14px; line-height: 2; color: rgba(255,255,255,.58); } .ndc-footer-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 46px; } .ndc-footer-col { display: flex; flex-direction: column; align-items: flex-start; } .ndc-footer-section-title { margin-bottom: 18px; font-size: 12px; line-height: 1.6; color: rgba(255,255,255,.42); letter-spacing: .14em; text-transform: uppercase; } .ndc-footer-col a, .ndc-footer-col .menu-item a { display: inline-block; margin-bottom: 12px; font-size: 13px; line-height: 1.7; color: rgba(255,255,255,.68); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.14); transition: color .25s ease, border-color .25s ease; } .ndc-footer-col a:hover { color: #fff; border-bottom-color: #fff; } .ndc-footer-col ul, .ndc-footer-col li { list-style: none; margin: 0; padding: 0; } .ndc-friend-links { padding: 42px 0; border-bottom: 1px solid rgba(255,255,255,.12); } .ndc-friend-links-list { display: flex; flex-wrap: wrap; gap: 10px 24px; } .ndc-friend-links-list a { color: rgba(255,255,255,.64); font-size: 13px; line-height: 1.8; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.14); transition: color .25s ease, border-color .25s ease; } .ndc-friend-links-list a:hover { color: #fff; border-bottom-color: #fff; } .ndc-footer-bottom { padding-top: 30px; } .ndc-footer-copy { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; font-size: 12px; line-height: 1.8; color: rgba(255,255,255,.42); } .ndc-footer-copy a { color: rgba(255,255,255,.56); text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.12); } .ndc-footer-copy a:hover { color: #fff; border-bottom-color: #fff; } .ndc-footer-copy .gaba { width: 14px; height: 14px; margin-right: 4px; vertical-align: -2px; } .ndc-backtop { position: fixed; right: 28px; bottom: 28px; z-index: 998; width: 40px; height: 40px; border-radius: 50%; background: rgba(247,245,240,.88); border: 1px solid rgba(0,0,0,.12); display: flex; align-items: center; justify-content: center; box-shadow: 0 12px 40px rgba(0,0,0,.08); cursor: pointer; } .ndc-backtop svg { width: 18px; height: 18px; } .site_side_container { z-index: 1001; } .sliding_close_helper_overlay { z-index: 1000; } /* ========================================================= Responsive ========================================================= */ @media (max-width: 900px) { .ndc-header-container { height: 64px !important; padding: 0 18px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; align-items: center !important; gap: 12px !important; } .ndc-logo, #logo { grid-column: 1 !important; height: 64px !important; min-width: 0 !important; justify-self: start !important; overflow: hidden !important; } .ndc-logo img, #logo img { max-height: 30px !important; max-width: 190px !important; } .site-title { font-size: 18px !important; max-width: 190px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } .ndc-main-nav { display: none !important; } .ndc-header-actions { grid-column: 2 !important; height: 64px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; justify-self: end !important; gap: 8px !important; width: auto !important; min-width: 88px !important; margin-left: auto !important; } .ndc-mobile-control { height: 64px !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; position: static !important; float: none !important; margin: 0 !important; padding: 0 !important; } .ndc-search-trigger, .ndc-menu-button { width: 40px !important; height: 40px !important; } .ndc-article-hero, .ndc-home-hero, .ndc-archive-hero, .ndc-list-hero { padding-top: 130px !important; } .header-banner { margin-top: 64px; } .site_side_container .widget, .site_side_container .widget_archive, .site_side_container .widget_categories, .site_side_container .widget_recent_entries, .site_side_container .widget_recent_comments, .site_side_container .widget_meta, .site_side_container .widget_pages, .site_side_container .widget_tag_cloud { display: none !important; } .ndc-home-inner { grid-template-columns: 1fr; gap: 56px; min-height: auto; } .ndc-home-lead { margin-left: 0; } .ndc-hero-card { max-width: 420px; } .ndc-post-link { grid-template-columns: 120px minmax(0, 1fr); gap: 32px; } .ndc-post-link:has(.ndc-post-no-thumb) { grid-template-columns: 120px minmax(0, 1fr); } .ndc-post-thumb { grid-column: 2; width: 100%; max-width: 360px; margin-top: 12px; } .ndc-article-layout { grid-template-columns: 1fr; gap: 56px; } .ndc-article-aside { position: static; } } @media screen and (max-width: 782px) { body.admin-bar .ndc-site-header { top: 46px; } body.admin-bar .ndc-search-close { top: 78px; } body.admin-bar .ndc-article-hero, body.admin-bar .ndc-home-hero, body.admin-bar .ndc-archive-hero, body.admin-bar .ndc-list-hero { padding-top: 176px !important; } body.admin-bar .header-banner { margin-top: 110px; } } @media (max-width: 768px) { .ndc-home-hero, .ndc-list-hero { padding: 118px 22px 72px; } .ndc-home-title { font-size: 52px; line-height: 1.08; } .ndc-home-lead { margin: 32px 0 0; font-size: 18px; } .ndc-hero-card { padding: 24px; } .ndc-hero-card span { margin-bottom: 28px; } .ndc-hero-card strong { font-size: 19px; } .ndc-posts-wrap { padding: 62px 22px 90px; } .ndc-posts-head { display: block; line-height: 1.9; } .ndc-post-link { display: block; padding: 38px 0; } .ndc-post-date { margin-bottom: 18px; } .ndc-post-title { font-size: 31px; line-height: 1.22; } .ndc-post-excerpt { font-size: 15px; } .ndc-post-thumb { margin-top: 28px; max-width: none; } .ndc-article-hero { min-height: auto; padding: 82px 22px 70px; display: block; } .ndc-article-title { font-size: 48px; line-height: 1.08; letter-spacing: -.055em; } .ndc-article-lead { margin: 32px 0 0; font-size: 18px; line-height: 1.8; } .ndc-hero-meta { margin-top: 48px; } .ndc-cover { width: calc(100% - 44px); margin-bottom: 80px; } .ndc-article-layout { display: flex; flex-direction: column; padding: 0 22px 90px; gap: 0; } .ndc-mobile-article-info { display: flex; flex-wrap: wrap; gap: 8px 16px; order: 1; margin-bottom: 42px; padding-top: 14px; border-top: 1px solid var(--ndc-line); font-size: 12px; line-height: 1.7; color: var(--ndc-muted); } .ndc-mobile-article-info a { color: inherit; text-decoration: none; border-bottom: none; } .ndc-article-body { order: 2; font-size: 17px; line-height: 2; max-width: 100%; overflow-x: hidden; } .ndc-article-aside { order: 3; position: static; margin-top: 80px; margin-bottom: 0; } .ndc-article-aside .ndc-side-info { display: none; } .ndc-side-block { margin-bottom: 38px; } .ndc-article-body h2, .ndc-article-body .wp-block-heading { margin-top: 76px; font-size: 34px; } .ndc-article-body figure { margin: 52px 0; } .ndc-article-footer { display: block; } .ndc-article-body .wp-block-table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } .ndc-article-body .wp-block-table table { width: max-content; min-width: 100%; max-width: none; font-size: 14px; } .ndc-article-body > table { display: block; width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; font-size: 14px; } .ndc-article-body th, .ndc-article-body td { padding: 13px 14px; white-space: nowrap; } .ndc-article-body td p, .ndc-article-body th p { margin: 0; } .ndc-footer-inner { padding: 62px 22px 34px; } .ndc-footer-main { display: block; padding-bottom: 46px; } .ndc-footer-title { font-size: 34px; line-height: 1.22; } .ndc-footer-desc { font-size: 13px; line-height: 1.9; } .ndc-footer-cols { margin-top: 42px; grid-template-columns: 1fr 1fr; gap: 28px; } .ndc-friend-links { padding: 34px 0; } .ndc-friend-links-list { gap: 8px 18px; } .ndc-footer-copy { display: block; font-size: 12px; } .ndc-footer-copy a, .ndc-footer-copy span { display: inline-block; margin-right: 12px; margin-bottom: 8px; } .ndc-backtop { right: 18px; bottom: 18px; width: 38px; height: 38px; } } @media (max-width: 520px) { .ndc-header-container { padding: 0 16px !important; } .ndc-logo img, #logo img { max-width: 160px !important; } .site-title { max-width: 160px !important; } .ndc-search-inner form { display: block; } .ndc-search-inner button[type="submit"] { margin-top: 24px; } .ndc-search-close { top: 24px; right: 22px; } } .ndc-article-nav-kicker { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 36px; } .ndc-prev-next { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; justify-self: end; width: min(620px, 100%); } .ndc-prev-next a { display: block; padding-top: 14px; border-top: 1px solid rgba(0,0,0,.16); color: #555; text-decoration: none; } .ndc-prev-next em { display: block; margin-bottom: 8px; font-style: normal; font-size: 12px; line-height: 1.4; color: #999; letter-spacing: .08em; } .ndc-prev-next strong { display: block; font-size: 13px; line-height: 1.55; font-weight: 400; color: #333; letter-spacing: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .ndc-prev-next a:hover { border-top-color: #111; } .ndc-prev-next a:hover strong { color: #111; } @media (max-width: 768px) { .ndc-article-nav-kicker { display: block; } .ndc-prev-next { margin-top: 20px; width: 100%; display: flex; flex-direction: column; gap: 16px; justify-self: auto; } .ndc-prev-next a { width: 100%; display: block; padding-top: 14px; border-top: 1px solid rgba(0,0,0,.16); } .ndc-prev-next strong { -webkit-line-clamp: 3; } } .ndc-article-nav-kicker { height: auto !important; overflow: visible !important; }