-
-
Save EdisonJwa/81ac75c2fc9298b4ea119b7a20b044f6 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html ⚡> | |
| <head> | |
| <meta charset="utf-8"> | |
| <link rel="canonical" href="https://www.wevg.org/archives/60018/" > | |
| <title>example - Vigorous Pro</title> | |
| <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"> | |
| <meta property="og:title" content="example"> | |
| <meta property="og:type" content="article"> | |
| <meta property="og:url" content="https://www.wevg.org/archives/60018/"> | |
| <meta property="og:image" content="/amp-dist/sample/sample-substituteTitleImage.png"> | |
| <meta property="og:site_name" content="Vigorous Pro"> | |
| <meta name="twitter:card" content="summary_large_image" /> | |
| <meta name="twitter:site" content="Vigorous Pro"> | |
| <meta name="twitter:url" content="https://www.wevg.org/archives/60018/"> | |
| <meta name="twitter:title" content="example - Vigorous Pro"> | |
| <meta name="twitter:image" content="/amp-dist/sample/sample-substituteTitleImage.png"> | |
| <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style> | |
| <noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript> | |
| <script async custom-element="amp-sidebar" src="https://cdn.ampproject.org/v0/amp-sidebar-0.1.js"></script> | |
| <!-- | |
| <script async custom-element="amp-social-share" src="https://cdn.ampproject.org/v0/amp-social-share-0.1.js"></script> | |
| --> | |
| <script async src="https://cdn.ampproject.org/v0.js"></script> | |
| <script type="application/ld+json"> | |
| { | |
| "@context": "http://schema.org", | |
| "@type": "BlogPosting", | |
| "headline": "example", | |
| "mainEntityOfPage":{ | |
| "@type":"WebPage", | |
| "@id":"https://www.wevg.org/archives/60018/" | |
| }, | |
| "datePublished": "2019-10-13T07:10:59.000Z", | |
| "dateModified": "2019-10-13T07:11:09.232Z", | |
| "image": { | |
| "@type": "ImageObject", | |
| "url": "/amp-dist/sample/sample-substituteTitleImage.png", | |
| "width" : "1024", | |
| "height" : "800" | |
| }, | |
| "author": { | |
| "@type": "Person", | |
| "name": "Edison Jwa" | |
| }, | |
| "publisher": { | |
| "@type": "Organization", | |
| "name": "Vigorous Pro" | |
| , | |
| "logo": { | |
| "@type": "ImageObject", | |
| "url": "https://www.wevg.org/amp-dist/sample/sample-logo.png", | |
| "width": 600, | |
| "height": 60 | |
| } | |
| } | |
| } | |
| </script> | |
| <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"> | |
| <style amp-custom> | |
| abbr, | |
| acronym, | |
| address, | |
| applet, | |
| big, | |
| blockquote, | |
| body, | |
| caption, | |
| cite, | |
| code, | |
| dd, | |
| del, | |
| dfn, | |
| div, | |
| dl, | |
| dt, | |
| em, | |
| fieldset, | |
| form, | |
| h1, | |
| h2, | |
| h3, | |
| h4, | |
| h5, | |
| h6, | |
| html, | |
| iframe, | |
| img, | |
| ins, | |
| kbd, | |
| label, | |
| legend, | |
| li, | |
| object, | |
| ol, | |
| p, | |
| pre, | |
| q, | |
| s, | |
| samp, | |
| small, | |
| span, | |
| strike, | |
| strong, | |
| sub, | |
| sup, | |
| table, | |
| tbody, | |
| td, | |
| tfoot, | |
| th, | |
| thead, | |
| tr, | |
| tt, | |
| ul, | |
| var { | |
| border: 0; | |
| font-family: inherit; | |
| font-size: 1rem; | |
| font-style: inherit; | |
| font-weight: inherit; | |
| margin: 0; | |
| outline: 0; | |
| padding: 0; | |
| vertical-align: baseline; | |
| } | |
| abbr { | |
| cursor: help; | |
| border-bottom: 1px dotted; | |
| font-variant: normal; | |
| } | |
| acronym { | |
| border-bottom: 1px dotted; | |
| font-variant: normal; | |
| } | |
| body { | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| -webkit-text-size-adjust: 100%; | |
| background: #fff; | |
| color: #2d3d40; | |
| font-family: sans-serif; | |
| font-size: 1rem; | |
| font-weight: 500; | |
| line-height: 2rem; | |
| text-rendering: optimizelegibility; | |
| } | |
| button::-moz-focus-inner, | |
| input::-moz-focus-inner, | |
| figure.highlight td, | |
| .post .entry-content figure.highlight th { | |
| border: 0; | |
| padding: 0; | |
| } | |
| caption, | |
| table, | |
| td, | |
| th { | |
| vertical-align: middle; | |
| } | |
| caption, | |
| td, | |
| th, | |
| .table-align-left { | |
| text-align: left; | |
| } | |
| del { | |
| text-decoration: line-through; | |
| } | |
| html { | |
| font-size: 14px; | |
| } | |
| :root sub, | |
| :root sup { | |
| vertical-align: baseline; | |
| } | |
| table { | |
| border-collapse: separate; | |
| border-spacing: 0; | |
| } | |
| a { | |
| color: #e91e63; | |
| text-decoration: none; | |
| -webkit-transition: 0.7s; | |
| -ms-transition: 0.7s; | |
| -moz-transition: 0.7s; | |
| -o-transition: 0.7s; | |
| -webkit-transition: 0.7s; | |
| -moz-transition: 0.7s; | |
| -o-transition: 0.7s; | |
| -ms-transition: 0.7s; | |
| transition: 0.7s; | |
| border: 0; | |
| font-family: inherit; | |
| font-size: 1rem; | |
| font-style: inherit; | |
| font-weight: inherit; | |
| margin: 0; | |
| outline: 0; | |
| padding: 0; | |
| vertical-align: baseline; | |
| } | |
| a img { | |
| border: none; | |
| } | |
| a:hover { | |
| -webkit-transition: 0.2s; | |
| -ms-transition: 0.2s; | |
| -moz-transition: 0.2s; | |
| -o-transition: 0.2s; | |
| -webkit-transition: 0.2s; | |
| -moz-transition: 0.2s; | |
| -o-transition: 0.2s; | |
| -ms-transition: 0.2s; | |
| transition: 0.2s; | |
| color: #930e3b; | |
| } | |
| @media (min-width: 481px) { | |
| html { | |
| font-size: 16px; | |
| } | |
| } | |
| @media (min-width: 0px) and (max-width: 480px) { | |
| html { | |
| font-size: 14px; | |
| } | |
| } | |
| .clearfix:after { | |
| clear: both; | |
| visibility: hidden; | |
| content: "."; | |
| display: block; | |
| height: 0; | |
| } | |
| .left { | |
| float: left; | |
| } | |
| .right { | |
| float: right; | |
| } | |
| .circle { | |
| -webkit-border-radius: 50%; | |
| border-radius: 50%; | |
| } | |
| .thumbImg-w { | |
| width: 100px; | |
| height: 100px; | |
| display: inline-block; | |
| position: relative; | |
| overflow: hidden; | |
| } | |
| .thumbImg { | |
| top: 50%; | |
| left: 50%; | |
| position: absolute; | |
| -webkit-transform: translate(-50%, -50%); | |
| -ms-transform: translate(-50%, -50%); | |
| -webkit-transform: translate(-50%, -50%); | |
| -moz-transform: translate(-50%, -50%); | |
| -o-transform: translate(-50%, -50%); | |
| -ms-transform: translate(-50%, -50%); | |
| transform: translate(-50%, -50%); | |
| } | |
| .__web-inspector-hide-shortcut__ { | |
| visibility: hidden ; | |
| } | |
| button { | |
| -webkit-box-align: start; | |
| -moz-box-align: start; | |
| -o-box-align: start; | |
| -ms-flex-align: start; | |
| -webkit-align-items: flex-start; | |
| align-items: flex-start; | |
| text-align: center; | |
| cursor: default; | |
| color: buttontext; | |
| background-color: buttonface; | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| box-sizing: border-box; | |
| padding: 2px 6px 3px; | |
| border-width: 2px; | |
| border-style: outset; | |
| border-color: buttonface; | |
| -webkit-border-image: initial; | |
| -moz-border-image: initial; | |
| -o-border-image: initial; | |
| border-image: initial; | |
| text-rendering: auto; | |
| color: initial; | |
| letter-spacing: normal; | |
| word-spacing: normal; | |
| text-transform: none; | |
| text-indent: 0px; | |
| text-shadow: none; | |
| display: inline-block; | |
| text-align: start; | |
| margin: 0em 0em 0em 0em; | |
| font: 11px system-ui; | |
| -webkit-writing-mode: horizontal-tb; | |
| -webkit-appearance: button; | |
| } | |
| .hamburger { | |
| display: inline-block; | |
| background-color: transparent; | |
| background-image: url("data:image/svg+xmlutf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"-3 -6 24 24\"><path fill=\"#4A4A4A\" d=\"M0 12h18v-2H0v2M0 7h18V5H0v2M0 0v2h18V0H0\"/></svg>"); | |
| background-repeat: no-repeat; | |
| -webkit-background-size: 30px 24px; | |
| -moz-background-size: 30px 24px; | |
| background-size: 30px 24px; | |
| background-position: center center; | |
| border: none; | |
| margin: 0; | |
| padding: 0; | |
| width: 60px; | |
| height: 60px; | |
| cursor: pointer; | |
| -ms-flex-item-align: center; | |
| -ms-grid-row-align: center; | |
| -webkit-align-self: center; | |
| align-self: center; | |
| -ms-flex-item-align: center; | |
| } | |
| .nav ul:after { | |
| clear: both; | |
| visibility: hidden; | |
| } | |
| .nav, | |
| .nav-icon { | |
| position: relative; | |
| } | |
| .nav ul { | |
| display: block; | |
| } | |
| .nav ul li { | |
| display: block; | |
| } | |
| .nav ul li a { | |
| display: block; | |
| } | |
| .tab { | |
| position: relative; | |
| color: #424242; | |
| padding: 6px; | |
| margin: 0 4px; | |
| text-decoration: none; | |
| text-transform: uppercase; | |
| font-weight: 400; | |
| -webkit-transition: 0.1s ease color; | |
| -webkit-transition: 0.1s ease color; | |
| -moz-transition: 0.1s ease color; | |
| -o-transition: 0.1s ease color; | |
| -ms-transition: 0.1s ease color; | |
| transition: 0.1s ease color; | |
| } | |
| amp-sidebar { | |
| width: 200px; | |
| } | |
| amp-sidebar ul { | |
| padding: 10px 0; | |
| } | |
| amp-sidebar li a { | |
| display: block; | |
| padding: 10px 20px; | |
| } | |
| header { | |
| height: 60px; | |
| background-color: #222f31; | |
| -webkit-box-shadow: 0 -1px 0 #3c5155 inset, 0 -3px 0 #1e292b inset; | |
| box-shadow: 0 -1px 0 #3c5155 inset, 0 -3px 0 #1e292b inset; | |
| -webkit-box-shadow: 0 -1px 0 #3c5155 inset, 0 -3px 0 #1e292b inset; | |
| } | |
| header .header-title a { | |
| padding: 0 0 0 20px; | |
| height: 60px; | |
| line-height: 60px; | |
| font-size: 20px; | |
| color: #fff; | |
| letter-spacing: 0.2em; | |
| } | |
| header .nav-container { | |
| display: -webkit-box; | |
| display: -ms-flexbox; | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: box; | |
| display: flex; | |
| -webkit-box-pack: justify; | |
| -ms-flex-pack: justify; | |
| -webkit-box-pack: justify; | |
| -moz-box-pack: justify; | |
| -o-box-pack: justify; | |
| -ms-flex-pack: justify; | |
| -webkit-justify-content: space-between; | |
| justify-content: space-between; | |
| } | |
| header .left-nav { | |
| display: -webkit-box; | |
| display: -ms-flexbox; | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: box; | |
| display: flex; | |
| -webkit-box-align: center; | |
| -ms-flex-align: center; | |
| -webkit-box-align: center; | |
| -moz-box-align: center; | |
| -o-box-align: center; | |
| -ms-flex-align: center; | |
| -webkit-align-items: center; | |
| align-items: center; | |
| -webkit-box-pack: start; | |
| -ms-flex-pack: start; | |
| -webkit-box-pack: start; | |
| -moz-box-pack: start; | |
| -o-box-pack: start; | |
| -ms-flex-pack: start; | |
| -webkit-justify-content: flex-start; | |
| justify-content: flex-start; | |
| font-size: 20px; | |
| margin-left: 0; | |
| font-weight: 300; | |
| -webkit-box-pack: start; | |
| -ms-flex-pack: start; | |
| -webkit-box-pack: start; | |
| -moz-box-pack: start; | |
| -o-box-pack: start; | |
| -ms-flex-pack: start; | |
| -webkit-justify-content: flex-start; | |
| justify-content: flex-start; | |
| -webkit-box-flex: 1; | |
| -ms-flex: 1 1 auto; | |
| -webkit-box-flex: 1; | |
| -moz-box-flex: 1; | |
| -o-box-flex: 1; | |
| box-flex: 1; | |
| -webkit-flex: 1 1 auto; | |
| -ms-flex: 1 1 auto; | |
| flex: 1 1 auto; | |
| text-align: left; | |
| width: auto; | |
| font-size: 15px; | |
| } | |
| header .right { | |
| font-size: 15px; | |
| } | |
| header .alt { | |
| padding: 0; | |
| text-align: right; | |
| display: -webkit-box; | |
| display: -ms-flexbox; | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: box; | |
| display: flex; | |
| -webkit-box-align: stretch; | |
| -ms-flex-align: stretch; | |
| -webkit-box-align: stretch; | |
| -moz-box-align: stretch; | |
| -o-box-align: stretch; | |
| -ms-flex-align: stretch; | |
| -webkit-align-items: stretch; | |
| align-items: stretch; | |
| -webkit-box-pack: center; | |
| -ms-flex-pack: center; | |
| -webkit-box-pack: center; | |
| -moz-box-pack: center; | |
| -o-box-pack: center; | |
| -ms-flex-pack: center; | |
| -webkit-justify-content: center; | |
| justify-content: center; | |
| } | |
| .blog-title a { | |
| position: relative; | |
| } | |
| button { | |
| -webkit-box-align: start; | |
| -moz-box-align: start; | |
| -o-box-align: start; | |
| -ms-flex-align: start; | |
| -webkit-align-items: flex-start; | |
| align-items: flex-start; | |
| text-align: center; | |
| cursor: default; | |
| color: buttontext; | |
| background-color: buttonface; | |
| -webkit-box-sizing: border-box; | |
| -moz-box-sizing: border-box; | |
| box-sizing: border-box; | |
| padding: 2px 6px 3px; | |
| border-width: 2px; | |
| border-style: outset; | |
| border-color: buttonface; | |
| -webkit-border-image: initial; | |
| -moz-border-image: initial; | |
| -o-border-image: initial; | |
| border-image: initial; | |
| text-rendering: auto; | |
| color: initial; | |
| letter-spacing: normal; | |
| word-spacing: normal; | |
| text-transform: none; | |
| text-indent: 0px; | |
| text-shadow: none; | |
| display: inline-block; | |
| text-align: start; | |
| margin: 0em 0em 0em 0em; | |
| font: 11px system-ui; | |
| -webkit-writing-mode: horizontal-tb; | |
| -webkit-appearance: button; | |
| } | |
| .__web-inspector-hide-shortcut__ { | |
| visibility: hidden ; | |
| } | |
| .hamburger { | |
| display: inline-block; | |
| background-color: transparent; | |
| background-image: url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"-3 -6 24 24\"><path fill=\"#FFF\" d=\"M0 12h18v-2H0v2M0 7h18V5H0v2M0 0v2h18V0H0\"/></svg>"); | |
| background-repeat: no-repeat; | |
| -webkit-background-size: 30px 24px; | |
| -moz-background-size: 30px 24px; | |
| background-size: 30px 24px; | |
| background-position: center center; | |
| border: none; | |
| margin: 0; | |
| padding: 0; | |
| width: 60px; | |
| height: 60px; | |
| cursor: pointer; | |
| -ms-flex-item-align: center; | |
| -ms-grid-row-align: center; | |
| -webkit-align-self: center; | |
| align-self: center; | |
| -ms-flex-item-align: center; | |
| } | |
| .tab { | |
| position: relative; | |
| color: #2d3d40; | |
| padding: 6px; | |
| margin: 0 4px; | |
| text-decoration: none; | |
| text-transform: uppercase; | |
| font-weight: 400; | |
| -webkit-transition: 0.1s ease color; | |
| -webkit-transition: 0.1s ease color; | |
| -moz-transition: 0.1s ease color; | |
| -o-transition: 0.1s ease color; | |
| -ms-transition: 0.1s ease color; | |
| transition: 0.1s ease color; | |
| } | |
| amp-sidebar { | |
| width: 250px; | |
| background-color: #182022; | |
| } | |
| amp-sidebar ul { | |
| padding: 10px 0; | |
| } | |
| amp-sidebar li { | |
| border-top: 1px solid #2f4043; | |
| } | |
| amp-sidebar li:last-child { | |
| border-bottom: 1px solid #2f4043; | |
| } | |
| amp-sidebar li a { | |
| color: #fff; | |
| font-weight: bold; | |
| display: block; | |
| padding: 10px 20px; | |
| } | |
| amp-sidebar li a:hover { | |
| color: #ccc; | |
| background-color: #030404; | |
| } | |
| .categories-header { | |
| background-color: #2d3d40; | |
| padding: 0rem 0.8rem; | |
| } | |
| .categories-header a { | |
| color: #fff; | |
| } | |
| .categories-header a:hover { | |
| color: #fff; | |
| } | |
| .categories-header .breadcrumb ol li { | |
| list-style: none; | |
| display: inline-block; | |
| margin: 0; | |
| } | |
| .categories-header .breadcrumb ol li span { | |
| font-size: 0.8rem; | |
| font-weight: bold; | |
| } | |
| .categories-header .breadcrumb ol li:after { | |
| content: "/"; | |
| color: #fff; | |
| display: inline-block; | |
| margin: 0 0.4rem; | |
| } | |
| .categories-header .breadcrumb ol li:last-child:after { | |
| content: ""; | |
| margin: 0; | |
| } | |
| .entry-header { | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: box; | |
| display: flex; | |
| -webkit-box-pack: center; | |
| -moz-box-pack: center; | |
| -o-box-pack: center; | |
| -ms-flex-pack: center; | |
| -webkit-justify-content: center; | |
| justify-content: center; | |
| -webkit-align-items: center; | |
| -webkit-box-align: center; | |
| -moz-box-align: center; | |
| -o-box-align: center; | |
| -ms-flex-align: center; | |
| -webkit-align-items: center; | |
| align-items: center; | |
| } | |
| .entry-header .flx:first-child { | |
| margin: 0 1rem 0 0; | |
| } | |
| .header-cap { | |
| -webkit-flex-grow: 3; | |
| -webkit-box-flex: 3; | |
| -moz-box-flex: 3; | |
| -o-box-flex: 3; | |
| -ms-box-flex: 3; | |
| box-flex: 3; | |
| -webkit-flex-grow: 3; | |
| flex-grow: 3; | |
| } | |
| .title-cover { | |
| background-color: #fff; | |
| color: #2d3d40; | |
| padding: 1.5rem 0.8rem 0 0.8rem; | |
| } | |
| .title-cover a { | |
| font-size: 1.2rem; | |
| color: #2d3d40; | |
| text-align: left; | |
| font-weight: bold; | |
| } | |
| .entry-title { | |
| margin: 0; | |
| } | |
| .entry-meta-header { | |
| font-size: 0.85rem; | |
| text-align: center; | |
| } | |
| .entry-meta-header .date { | |
| font-family: sans-serif; | |
| } | |
| h1 a, | |
| h2 a, | |
| h3 a, | |
| h4 a, | |
| h5 a, | |
| h6 a { | |
| color: #2d3d40; | |
| text-decoration: none; | |
| } | |
| h1 a:hover, | |
| h2 a:hover, | |
| h3 a:hover, | |
| h4 a:hover, | |
| h5 a:hover, | |
| h6 a:hover { | |
| color: #e91e63; | |
| } | |
| #container { | |
| margin-left: auto; | |
| margin-right: auto; | |
| } | |
| #main { | |
| margin-bottom: 3em; | |
| padding-left: 0; | |
| } | |
| .post { | |
| margin-bottom: 3rem; | |
| position: relative; | |
| } | |
| .entry-content { | |
| margin: 0 0.6rem; | |
| font-size: 1rem; | |
| } | |
| .entry-content h1 { | |
| font-size: 1.7rem; | |
| line-height: 1.5; | |
| margin: 1em 0 0.8em; | |
| } | |
| .entry-content h2, | |
| .entry-content h3, | |
| .entry-content h4, | |
| .entry-content h5, | |
| .entry-content h6, | |
| .entry-content h2 span, | |
| .entry-content h3 span, | |
| .entry-content h4 span, | |
| .entry-content h5 span, | |
| .entry-content h6 span { | |
| color: #98b8be; | |
| font-weight: bold; | |
| } | |
| .entry-content h2, | |
| .entry-content h2 span { | |
| font-size: 1.8rem; | |
| line-height: 2.6rem; | |
| text-align: center; | |
| } | |
| .entry-content h2 { | |
| border-bottom: 2px solid #cce4e8; | |
| margin: 4.5rem 0 0.5em; | |
| padding: 0.8em 0; | |
| } | |
| .entry-content h3, | |
| .entry-content h3 span { | |
| font-size: 1.6rem; | |
| line-height: 2.2rem; | |
| text-align: center; | |
| } | |
| .entry-content h3 { | |
| margin: 3.6rem 0.8rem 3rem 0.8rem; | |
| padding: 0; | |
| } | |
| .entry-content h4, | |
| .entry-content h4 span { | |
| font-size: 1.4rem; | |
| line-height: 2rem; | |
| text-align: center; | |
| } | |
| .entry-content h4 { | |
| margin: 3.6rem 0.8rem 3rem 0.8rem; | |
| padding: 0; | |
| } | |
| .entry-content h5, | |
| .entry-content h5 span { | |
| font-size: 1.2rem; | |
| line-height: 1.8rem; | |
| text-align: center; | |
| } | |
| .entry-content h5 { | |
| margin: 3.6rem 0.8rem 3rem 0.8rem; | |
| padding: 0; | |
| } | |
| .entry-content h6, | |
| .entry-content h6 span { | |
| font-size: 1.1rem; | |
| line-height: 1.6rem; | |
| text-align: center; | |
| } | |
| .entry-content h6 { | |
| margin: 3.6rem 0.8rem 3rem 0.8rem; | |
| padding: 0; | |
| } | |
| .entry-content p { | |
| font-size: 1rem; | |
| letter-spacing: 0.05rem; | |
| line-height: 2.2rem; | |
| margin: 3rem 0.8rem; | |
| } | |
| .entry-content p a { | |
| word-wrap: break-word; | |
| overflow-wrap: break-word; | |
| display: inline; | |
| border-bottom: 1px dashed #f1729d; | |
| padding-bottom: 0.3rem; | |
| } | |
| .entry-content p a:hover { | |
| border-bottom: 1px dashed #9c0f3f; | |
| padding-bottom: 0.4rem; | |
| } | |
| .entry-content em { | |
| background-color: #f9f5d1; | |
| color: #886d00; | |
| font-style: normal; | |
| margin: 0 2px; | |
| padding: 0.4em; | |
| } | |
| .entry-content strong { | |
| color: #871c1c; | |
| font-style: normal; | |
| margin: 0 2px; | |
| padding: 0.4em; | |
| background-color: #fadcdc; | |
| } | |
| .entry-content hr { | |
| border: 0; | |
| border-top: 3px solid #cce4e8; | |
| margin: 3rem auto; | |
| width: 20%; | |
| } | |
| .entry-content img, | |
| .entry-content video { | |
| display: block; | |
| height: auto; | |
| margin: auto; | |
| max-width: 100%; | |
| } | |
| .entry-content iframe { | |
| width: 100% ; | |
| } | |
| .entry-content blockquote { | |
| margin: 3rem 0.8rem; | |
| padding: 1rem 1.8rem; | |
| position: relative; | |
| background-color: none; | |
| border-left: 3px solid #98b8be; | |
| font-style: italic; | |
| } | |
| .entry-content blockquote p { | |
| margin: 0.5rem 0; | |
| } | |
| .entry-content blockquote blockquote { | |
| border-left: none; | |
| } | |
| .entry-content .table-wrapper { | |
| margin: 3rem 0.8rem; | |
| } | |
| .entry-content table { | |
| border-collapse: collapse; | |
| border-spacing: 0; | |
| overflow: auto; | |
| display: block; | |
| font-size: 0.85rem; | |
| margin: 0 auto; | |
| width: auto; | |
| } | |
| .entry-content td, | |
| .entry-content th { | |
| line-height: 1.8em; | |
| padding: 0.8rem 0.8rem; | |
| font-size: 0.85rem; | |
| } | |
| .entry-content td em, | |
| .entry-content th em, | |
| .entry-content td strong, | |
| .entry-content th strong, | |
| .entry-content td a, | |
| .entry-content th a { | |
| font-size: 0.85rem; | |
| } | |
| .entry-content td { | |
| border: 1px solid #c4c4c4; | |
| } | |
| .entry-content th { | |
| background-color: #ecf5f7; | |
| border: 1px solid #c4c4c4; | |
| } | |
| .entry-content .table-align-center { | |
| text-align: center; | |
| } | |
| .entry-content .table-align-right { | |
| text-align: right; | |
| } | |
| .entry-content ul, | |
| .entry-content ol, | |
| .entry-content dl { | |
| margin: 3rem 0 3rem 1.6rem; | |
| padding: 0; | |
| list-style: none; | |
| font-size: 1rem; | |
| } | |
| .entry-content ul li, | |
| .entry-content ol li, | |
| .entry-content dl li { | |
| line-height: 2rem; | |
| position: relative; | |
| padding: 0; | |
| } | |
| .entry-content ul li p, | |
| .entry-content ol li p, | |
| .entry-content dl li p { | |
| line-height: 2rem; | |
| margin: 0; | |
| } | |
| .entry-content ul li p:not(:first-child), | |
| .entry-content ol li p:not(:first-child), | |
| .entry-content dl li p:not(:first-child) { | |
| color: #57767c; | |
| margin: 0.5rem; | |
| } | |
| .entry-content ul li ul, | |
| .entry-content ol li ul, | |
| .entry-content dl li ul, | |
| .entry-content ul li ol, | |
| .entry-content ol li ol, | |
| .entry-content dl li ol, | |
| .entry-content ul li dl, | |
| .entry-content ol li dl, | |
| .entry-content dl li dl { | |
| margin: 1rem; | |
| } | |
| .entry-content ul li { | |
| margin: 0.4rem 0 0.4rem 0.8rem; | |
| } | |
| .entry-content ul li::after { | |
| position: absolute; | |
| display: block; | |
| content: ''; | |
| top: 0.75rem; | |
| left: -1rem; | |
| width: 0.5rem; | |
| height: 0.5rem; | |
| background-color: #cce4e8; | |
| border-radius: 100%; | |
| } | |
| .entry-content ol { | |
| counter-reset: number; | |
| } | |
| .entry-content ol li { | |
| margin: 0.4rem 0 0.4rem 2rem; | |
| } | |
| .entry-content ol li p:first-child { | |
| display: inline-block; | |
| line-height: 1.6rem; | |
| height: 1.6rem; | |
| } | |
| .entry-content ol li:before { | |
| position: absolute; | |
| display: inline-block; | |
| float: left; | |
| margin: 0 0.2rem 0 0; | |
| padding: 0; | |
| counter-increment: number; | |
| content: counter(number); | |
| left: -2.2rem; | |
| top: 0.2rem; | |
| background-color: #98b8be; | |
| width: 1.6rem; | |
| height: 1.6rem; | |
| border-radius: 50%; | |
| color: #fff; | |
| text-align: center; | |
| font-weight: bold; | |
| font-size: 0.8rem; | |
| line-height: 1.6rem; | |
| } | |
| kbd { | |
| font-family: sans-serif; | |
| text-align: center; | |
| display: inline-block; | |
| color: #425a5e; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-border-radius: 3px; | |
| -webkit-box-shadow: 0 0 10px #e8e8e8 inset, 0 1px 0 #c3c3c3, 0 2px 0 #c9c9c9, 0 3px 3px #333; | |
| box-shadow: 0 0 10px #e8e8e8 inset, 0 1px 0 #c3c3c3, 0 2px 0 #c9c9c9, 0 3px 3px #333; | |
| -webkit-box-shadow: 0 0 10px #e2e2e2 inset, 0 1px 0 #c3c3c3, 0 2px 0 #c9c9c9, 0 3px 3px #333; | |
| -webkit-font-smoothing: subpixel-antialiased; | |
| background: #fff; | |
| border-left: 1px solid #fff; | |
| border-radius: 3px; | |
| border-right: 1px solid #e6e6e6; | |
| border-top: 1px solid #fff; | |
| font-size: 0.85rem; | |
| line-height: 1rem; | |
| margin: 5px; | |
| padding: 6px 8px 3px; | |
| text-shadow: 0 1px 0 #fff; | |
| vertical-align: baseline; | |
| } | |
| img.responsive-img { | |
| height: auto; | |
| max-width: 100%; | |
| } | |
| video.responsive-video { | |
| height: auto; | |
| max-width: 100%; | |
| } | |
| amp-instagram, | |
| amp-vimeo, | |
| amp-video, | |
| amp-youtube, | |
| amp-twitter, | |
| .soundcloud-wrapper, | |
| .amp-img-wrapper, | |
| .googleAdPost, | |
| .ad-footer { | |
| margin: 3rem 0.8rem; | |
| } | |
| code, | |
| figure.highlight .code, | |
| pre { | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: subpixel-antialiased; | |
| } | |
| code, | |
| pre, | |
| samp { | |
| font-family: Menlo, Consolas, Monaco, Consolas, monospace; | |
| } | |
| p code { | |
| font-size: 1rem; | |
| } | |
| code, | |
| pre { | |
| font-size: 0.85rem; | |
| letter-spacing: 0.05rem; | |
| background-color: #ecf5f7; | |
| color: #007e96; | |
| } | |
| code { | |
| margin: 0 3px; | |
| padding: 0.4em; | |
| } | |
| samp { | |
| font-size: 0.85rem; | |
| letter-spacing: 0.05rem; | |
| } | |
| sub, | |
| sup { | |
| font-size: 0.75rem; | |
| line-height: 0; | |
| position: relative; | |
| } | |
| sub { | |
| bottom: -0.2em; | |
| } | |
| sup { | |
| top: -0.5em; | |
| } | |
| pre { | |
| font-size: 1rem; | |
| letter-spacing: 0.05rem; | |
| margin: 0 3px; | |
| padding: 15px; | |
| -webkit-background-clip: padding; | |
| -moz-background-clip: padding; | |
| background-clip: padding-box; | |
| border: 0; | |
| line-height: 1.3rem; | |
| overflow-x: auto; | |
| } | |
| pre .addition, | |
| pre .css .tag, | |
| pre .keyword, | |
| pre .method, | |
| pre .nginx .title, | |
| pre .request, | |
| pre .status, | |
| pre .winutils { | |
| color: #66d9ef; | |
| } | |
| pre .attr_selector, | |
| pre .cdata, | |
| pre .clojure .title, | |
| pre .diff .change, | |
| pre .important { | |
| color: #9882eb; | |
| } | |
| pre .preprocessor { | |
| color: #9882eb; | |
| } | |
| pre .preprocessor .keyword { | |
| color: #9882eb; | |
| } | |
| pre .shebang, | |
| pre .special, | |
| pre .subst { | |
| color: #9882eb; | |
| } | |
| pre .symbol { | |
| color: #9882eb; | |
| } | |
| pre .symbol .string { | |
| color: #9882eb; | |
| } | |
| pre .attribute, | |
| pre .class .title, | |
| pre .constant, | |
| pre .haskell .type, | |
| pre .lisp .body, | |
| pre .parent, | |
| pre .smalltalk .number, | |
| pre .variable { | |
| color: #a6e22e; | |
| } | |
| pre .built_in, | |
| pre .chunk, | |
| pre .decorator, | |
| pre .id, | |
| pre .identifier, | |
| pre .literal, | |
| pre .localvars, | |
| pre .title, | |
| pre .vhdl, | |
| pre .deletion { | |
| color: #f92672; | |
| } | |
| pre .command, | |
| pre .hexcolor, | |
| pre .number, | |
| pre .phpdoc, | |
| pre .regexp, | |
| pre .string, | |
| pre .tag .value, | |
| pre .tex .formula { | |
| color: #e6db74; | |
| } | |
| pre .comment, | |
| pre .diff .header, | |
| pre .doctype, | |
| pre .javadoc, | |
| pre .lisp .string, | |
| pre .pi, | |
| pre .template_comment { | |
| color: #75715e; | |
| font-weight: normal; | |
| } | |
| .line { | |
| font-size: 0.85rem; | |
| letter-spacing: 0.05rem; | |
| line-height: 2rem; | |
| color: #f8f8f2; | |
| } | |
| .line span { | |
| font-size: 0.85rem; | |
| letter-spacing: 0.05rem; | |
| } | |
| .gist { | |
| background: #fff; | |
| border: 1px solid color-gutter; | |
| color: #f8f8f2; | |
| line-height: 1.6rem; | |
| margin-top: 15px; | |
| overflow: auto; | |
| padding: 7px 15px; | |
| } | |
| .gist .gist-file { | |
| border: none; | |
| font-family: inherit; | |
| font-size: 1rem; | |
| letter-spacing: 0; | |
| margin: 0; | |
| } | |
| .gist .gist-file .gist-data { | |
| background: 0 0; | |
| border-bottom: none; | |
| } | |
| .gist .gist-file .gist-data pre { | |
| font-family: Menlo, Consolas, Monaco, Consolas, monospace; | |
| padding: 0 ; | |
| } | |
| .gist .gist-file .gist-meta { | |
| background: 0 0; | |
| color: #f8f8f2; | |
| font-size: 1rem; | |
| margin-top: 5px; | |
| padding: 0; | |
| } | |
| .gist .gist-file .gist-meta a { | |
| color: #f8f8f2; | |
| } | |
| .gist .gist-file .gist-meta a:visited { | |
| color: #f8f8f2; | |
| } | |
| figure.highlight { | |
| font-size: 0.95rem; | |
| margin: 3rem 0.8rem; | |
| background: #263338; | |
| border: 1px solid color-gutter; | |
| line-height: 2rem; | |
| overflow: auto; | |
| position: relative; | |
| } | |
| figure.highlight .code { | |
| padding: 0 1em 1em 1em; | |
| color: #f8f8f2; | |
| } | |
| figure.highlight .gutter { | |
| display: none; | |
| } | |
| figure.highlight figcaption { | |
| font-size: 1rem; | |
| font-weight: bold; | |
| color: #e9e9d6; | |
| background-color: #1e282c; | |
| padding: 0.6em 1em; | |
| } | |
| figure.highlight figcaption a { | |
| position: absolute; | |
| right: 1rem; | |
| } | |
| figure.highlight figcaption:before { | |
| content: "\f121"; | |
| font-family: "fontawesome"; | |
| text-align: center; | |
| display: inline-block; | |
| margin-right: 0.6em; | |
| } | |
| figure.highlight pre { | |
| background: 0 0; | |
| border: none; | |
| margin: 0; | |
| padding: 0.5rem; | |
| } | |
| figure.highlight table { | |
| border-spacing: 0; | |
| margin: 0; | |
| } | |
| figure.highlight th { | |
| border: 0; | |
| font-weight: 400; | |
| padding: 0; | |
| } | |
| figure.highlight td { | |
| border: 0; | |
| font-size: 1.1rem; | |
| padding: 0; | |
| } | |
| .entry-content .toc { | |
| background: #fff; | |
| padding: 0.5rem; | |
| margin: 3rem 0; | |
| border: 1px solid #cce4e8; | |
| border-radius: 2px; | |
| } | |
| .entry-content .toc ul { | |
| margin-bottom: 0; | |
| padding: 0; | |
| margin: 0; | |
| border-top: 1px solid #5d8b93; | |
| border-radius: 2px; | |
| } | |
| .entry-content .toc ul:first-child { | |
| border-top: none; | |
| } | |
| .entry-content .toc ul ul, | |
| .entry-content .toc ul ol { | |
| margin-bottom: 0; | |
| padding: 0; | |
| margin: 0; | |
| } | |
| .entry-content .toc ul li { | |
| padding: 0; | |
| margin: 0; | |
| border-top: 1px solid #5d8b93; | |
| } | |
| .entry-content .toc ul li:first-child { | |
| border-top: none; | |
| } | |
| .entry-content .toc ul li::after, | |
| .entry-content .toc ul li::before { | |
| content: normal; | |
| } | |
| .entry-content .toc ul li a { | |
| font-size: 1.2rem; | |
| font-weight: bold; | |
| display: block; | |
| padding: 1rem; | |
| background-color: #3d5b61; | |
| color: #fff; | |
| -webkit-transition: 0.3s; | |
| -ms-transition: 0.3s; | |
| -moz-transition: 0.3s; | |
| -o-transition: 0.3s; | |
| -webkit-transition: 0.3s; | |
| -moz-transition: 0.3s; | |
| -o-transition: 0.3s; | |
| -ms-transition: 0.3s; | |
| transition: 0.3s; | |
| } | |
| .entry-content .toc ul li a:hover { | |
| color: #fff; | |
| background-color: #2c4145; | |
| } | |
| .entry-content .toc ul li a:before { | |
| content: "\f02d"; | |
| font-family: "fontawesome"; | |
| display: inline-block; | |
| padding: 0; | |
| margin: 0; | |
| margin-right: 0.8rem; | |
| } | |
| .entry-content .toc ul li ul, | |
| .entry-content .toc ul li ol { | |
| margin-bottom: 0; | |
| padding: 0; | |
| margin: 0; | |
| } | |
| .entry-content .toc ul li ul li a, | |
| .entry-content .toc ul li ol li a { | |
| padding: 0.5rem 0.75rem 0.5rem 2rem; | |
| font-size: 0.9rem; | |
| background-color: #416167; | |
| } | |
| .entry-content .toc ul li ul li a:before, | |
| .entry-content .toc ul li ol li a:before { | |
| content: "\f0da"; | |
| font-family: "fontawesome"; | |
| display: inline-block; | |
| padding: 0; | |
| margin: 0; | |
| margin-right: 0.6rem; | |
| } | |
| .entry-content .toc ul li ul li ul li a, | |
| .entry-content .toc ul li ol li ul li a { | |
| padding: 0.5rem 0.75rem 0.5rem 4rem; | |
| } | |
| .entry-content .toc ul li ul li ul li a:before, | |
| .entry-content .toc ul li ol li ul li a:before { | |
| content: none; | |
| } | |
| .meta-content { | |
| background-color: #fff; | |
| margin: 1.5rem 0.8rem; | |
| padding: 0; | |
| border-top: 1px dotted #cce4e8; | |
| letter-spacing: 0.05rem; | |
| } | |
| .meta-wrapper { | |
| margin: 3rem 0.8rem; | |
| padding: 0; | |
| background-color: #fff; | |
| } | |
| h6.tag, | |
| h6.categories { | |
| color: #2d3d40; | |
| font-size: 0.9rem; | |
| font-weight: bold; | |
| } | |
| .article-tag-list { | |
| padding: 0; | |
| } | |
| .article-tag, | |
| .article-tag-list, | |
| .article-categories, | |
| .article-categories-list { | |
| padding: 0; | |
| margin: 0; | |
| } | |
| .article-categories { | |
| margin-bottom: 1.6em; | |
| } | |
| .article-tag-list li, | |
| .article-categories-list li { | |
| list-style: none; | |
| display: inline-block; | |
| padding: 0; | |
| margin: 0.2rem 0.1rem; | |
| } | |
| .article-tag-list li a, | |
| .article-categories-list li a { | |
| font-size: 0.8rem; | |
| font-weight: bold; | |
| padding: 0.4rem 0.8rem; | |
| margin: 0; | |
| background-color: #ecf5f7; | |
| color: #2d3d40; | |
| border-radius: 2px; | |
| display: block; | |
| } | |
| .article-tag-list li a:before, | |
| .article-categories-list li a:before { | |
| content: "#"; | |
| } | |
| .article-tag-list li a:hover, | |
| .article-categories-list li a:hover { | |
| color: #fff; | |
| background-color: #2d3d40; | |
| } | |
| .widget { | |
| margin: 1.5rem 0.8rem; | |
| padding: 0; | |
| } | |
| .widget-h { | |
| text-align: center; | |
| margin: 1.6rem 0; | |
| } | |
| .widget-h h6 { | |
| color: #fff; | |
| background-color: #2d3d40; | |
| display: inline-block; | |
| padding: 0.4rem 1rem; | |
| font-size: 0.9rem; | |
| font-weight: bold; | |
| } | |
| .posts-list li { | |
| list-style: none; | |
| margin: 0.8rem 0; | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: box; | |
| display: flex; | |
| -webkit-box-pack: center; | |
| -moz-box-pack: center; | |
| -o-box-pack: center; | |
| -ms-flex-pack: center; | |
| -webkit-justify-content: center; | |
| justify-content: center; | |
| -webkit-align-items: center; | |
| -webkit-box-align: center; | |
| -moz-box-align: center; | |
| -o-box-align: center; | |
| -ms-flex-align: center; | |
| -webkit-align-items: center; | |
| align-items: center; | |
| } | |
| .posts-list li .posts-list-link { | |
| -webkit-flex-grow: 3; | |
| -webkit-box-flex: 3; | |
| -moz-box-flex: 3; | |
| -o-box-flex: 3; | |
| -ms-box-flex: 3; | |
| box-flex: 3; | |
| -webkit-flex-grow: 3; | |
| flex-grow: 3; | |
| } | |
| .posts-list li .posts-list-link a { | |
| color: #2d3d40; | |
| font-size: 1.1rem; | |
| font-weight: bold; | |
| } | |
| .posts-list li .posts-list-link a:hover { | |
| color: #e91e63; | |
| } | |
| .posts-list li .posts-list-meta { | |
| font-size: 0.7rem; | |
| } | |
| .posts-list li .flx:first-child { | |
| margin: 0 1rem 0 0; | |
| } | |
| .posts-list li amp-img { | |
| border-radius: 2px; | |
| } | |
| #footer { | |
| background-color: #2d3d40; | |
| color: #fff; | |
| display: block; | |
| font-size: 1rem; | |
| letter-spacing: 0.05rem; | |
| line-height: 2rem; | |
| margin: 3rem 0 0 0; | |
| padding: 0; | |
| } | |
| .site-author-info { | |
| margin: 0; | |
| padding: 3rem 1.6rem; | |
| } | |
| .site-author-info h6 { | |
| font-size: 1rem; | |
| color: #fff; | |
| font-weight: bold; | |
| display: inline-block; | |
| background-color: #222f31; | |
| padding: 0.4rem 0.8rem; | |
| } | |
| .site-author-info-wrapper { | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: box; | |
| display: flex; | |
| -webkit-box-pack: center; | |
| -moz-box-pack: center; | |
| -o-box-pack: center; | |
| -ms-flex-pack: center; | |
| -webkit-justify-content: center; | |
| justify-content: center; | |
| -webkit-align-items: center; | |
| -webkit-box-align: center; | |
| -moz-box-align: center; | |
| -o-box-align: center; | |
| -ms-flex-align: center; | |
| -webkit-align-items: center; | |
| align-items: center; | |
| } | |
| .site-author-info-wrapper .flx:first-child { | |
| margin: 0 1rem 0 0; | |
| } | |
| .authorCap-wrapper { | |
| -webkit-flex-grow: 3; | |
| -webkit-box-flex: 3; | |
| -moz-box-flex: 3; | |
| -o-box-flex: 3; | |
| -ms-box-flex: 3; | |
| box-flex: 3; | |
| -webkit-flex-grow: 3; | |
| flex-grow: 3; | |
| } | |
| .authorCap { | |
| font-size: 1.4rem; | |
| font-weight: bold; | |
| } | |
| .authorReading { | |
| font-size: 0.7rem; | |
| } | |
| .site-author-desc { | |
| font-size: 0.8rem; | |
| line-height: 1.6rem; | |
| margin: 1.4rem 0; | |
| } | |
| .copyright-tool { | |
| margin: 0; | |
| padding: 1.5rem 1.6rem; | |
| border-top: 1px solid #384b4f; | |
| } | |
| .copyright-notice p { | |
| font-size: 0.6rem; | |
| letter-spacing: 0.05rem; | |
| line-height: 1.2rem; | |
| color: #8ba8ae; | |
| } | |
| .copyright-title { | |
| font-size: 1rem; | |
| text-align: center; | |
| margin: 0.8rem 0 0.4rem 0; | |
| } | |
| .copyright-license { | |
| margin: 0.4rem 0 0.8rem 0; | |
| font-size: 0.7rem; | |
| text-align: center; | |
| } | |
| .copyright-license a { | |
| color: #e6e6e6; | |
| font-size: 0.7rem; | |
| } | |
| .copyright-license a:hover { | |
| color: #b3b3b3; | |
| } | |
| .sns-link { | |
| margin: 0; | |
| text-align: center; | |
| } | |
| .sns-link a { | |
| display: inline-block; | |
| font-size: 1.6rem; | |
| text-align: center; | |
| width: 2rem; | |
| height: 2rem; | |
| line-height: 2rem; | |
| padding: 0.6rem; | |
| margin: 0 0.1rem; | |
| background-color: #222f31; | |
| color: #fff; | |
| border-radius: 4px; | |
| } | |
| .sns-link a:hover { | |
| color: #ccc; | |
| background-color: #030404; | |
| } | |
| .footer-menu { | |
| padding: 1.5rem 0.8rem; | |
| border-top: 1px solid #384b4f; | |
| } | |
| .footer-menu ul li { | |
| list-style: none; | |
| margin: 0; | |
| padding: 0; | |
| } | |
| .footer-menu ul li a { | |
| display: block; | |
| padding: 0.6rem; | |
| margin: 0.2rem 1.6rem; | |
| font-size: 1rem; | |
| color: #fff; | |
| background-color: #222f31; | |
| border-radius: 4px; | |
| text-align: center; | |
| font-weight: bold; | |
| } | |
| .footer-menu ul li a:hover { | |
| color: #ccc; | |
| background-color: #030404; | |
| } | |
| .social-share { | |
| margin: 1.5rem 0.8rem; | |
| display: -webkit-box; | |
| display: -moz-box; | |
| display: -webkit-flex; | |
| display: -ms-flexbox; | |
| display: box; | |
| display: flex; | |
| -webkit-box-pack: center; | |
| -moz-box-pack: center; | |
| -o-box-pack: center; | |
| -ms-flex-pack: center; | |
| -webkit-justify-content: center; | |
| justify-content: center; | |
| } | |
| .social-share amp-social-share, | |
| .social-share .sbtn { | |
| margin: 5px; | |
| } | |
| .sbtn { | |
| padding: 0; | |
| width: 4rem; | |
| height: 3rem; | |
| line-height: 3rem; | |
| color: #fff; | |
| font-size: 1.2rem; | |
| text-align: center; | |
| border-radius: 4px; | |
| } | |
| .sbtn:hover { | |
| color: #fff; | |
| } | |
| .tw { | |
| background-color: #1cafe8; | |
| } | |
| .tw:hover { | |
| background-color: #0f6b8f; | |
| } | |
| .fb { | |
| background-color: #4f677f; | |
| } | |
| .fb:hover { | |
| background-color: #283440; | |
| } | |
| .ht { | |
| background-color: #35acda; | |
| } | |
| .ht:hover { | |
| background-color: #1a6e8f; | |
| } | |
| .gp { | |
| background-color: #d56153; | |
| } | |
| .gp:hover { | |
| background-color: #9c3326; | |
| } | |
| .tb { | |
| background-color: #465f79; | |
| } | |
| .tb:hover { | |
| background-color: #212c38; | |
| } | |
| .icon-hatena:before { | |
| content: "B"; | |
| font-weight: bold; | |
| font-size: 1.2rem; | |
| } | |
| #totop { | |
| position: fixed; | |
| bottom: 2rem; | |
| right: 1.6rem; | |
| font-size: 1.2rem; | |
| z-index: 995; | |
| } | |
| #totop a { | |
| background: rgba(152,184,190,0.6); | |
| text-decoration: none; | |
| color: #fff; | |
| padding: 0.8rem; | |
| border-radius: 50%; | |
| } | |
| #totop a:before { | |
| content: "\f062"; | |
| font-family: "fontawesome"; | |
| font-size: 1.2rem; | |
| } | |
| #totop a:hover { | |
| text-decoration: none; | |
| background: #5d8b93; | |
| color: #fff; | |
| line-height: 2.3em; | |
| } | |
| @media (min-width: 800px) { | |
| .title-cover, | |
| .entry-content, | |
| .categories, | |
| .meta-content, | |
| .site-author-info { | |
| width: 780px; | |
| margin: 0 auto; | |
| } | |
| .nav-container { | |
| width: 800px; | |
| margin: 0 auto; | |
| } | |
| } | |
| @media (min-width: 0px) and (max-width: 480px) { | |
| .site-author-info-wrapper { | |
| display: block; | |
| } | |
| .gravatar-area { | |
| text-align: center; | |
| } | |
| .gravatar-area amp-img { | |
| display: inline-block; | |
| } | |
| .entry-content td, | |
| .entry-content th { | |
| line-height: 1.8em; | |
| padding: 0.6rem 0.6rem; | |
| font-size: 0.5rem; | |
| } | |
| .entry-content td em, | |
| .entry-content th em, | |
| .entry-content td strong, | |
| .entry-content th strong, | |
| .entry-content td a, | |
| .entry-content th a { | |
| font-size: 0.5rem; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <!-- google analytics --> | |
| <!-- menu --> | |
| <header> | |
| <div class="nav-container"> | |
| <div class="left-nav"> | |
| <div class="header-title"> | |
| <a href="/">Vigorous Pro</a> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- sidebar --> | |
| <!-- container --> | |
| <div id="container"> | |
| <div id="main"> | |
| <article id="post-example" class="post"> | |
| <!-- categories and bread crumb --> | |
| <!-- entry title --> | |
| <div class="title-cover"> | |
| <div class="entry-header"> | |
| <div class="header-thumb flx"> | |
| <div class="thumbImg-w circle"> | |
| <amp-img class="thumbImg" layout="fixed" width="128" height="100" src="/amp-dist/sample/sample-substituteTitleImage.png"> | |
| </amp-img> | |
| </div> | |
| </div> | |
| <div class="header-cap flx"> | |
| <h1 class="article-title entry-title" itemprop="name"> | |
| <a href="https://www.wevg.org/archives/60018/" target="_blank" itemprop="url">example</a> | |
| </h1> | |
| </div> | |
| </div> | |
| <!-- datePublished --> | |
| <div class="entry-meta-header"> | |
| <span class="meta-elements date"> | |
| <span class="fa fa-fw fa-clock-o"></span> | |
| <time datetime="2019-10-13" itemprop="datePublished">2019.10.13</time> | |
| </span> | |
| </div> | |
| </div> | |
| <!-- entry content --> | |
| <div class="entry-content ecp"> | |
| <!-- social share button --> | |
| <!-- google Adsense Matched content --> | |
| <!-- content --> | |
| <!-- google Adsense --> | |
| <!-- google Adsense Matched content --> | |
| </div> | |
| </article> | |
| <!-- TAGS --> | |
| <!-- Categories posts --> | |
| <!-- Detailed categories posts --> | |
| <!-- Latests --> | |
| </div> | |
| <footer id="footer"> | |
| <div class="copyright-tool"> | |
| <div class="copyright-title"> | |
| <span> | |
| © 2019 Vigorous Pro | |
| </span> | |
| </div> | |
| <div class="copyright-license"> | |
| <aside> | |
| Powered by <a href="https://hexo.io/">Hexo</a>. <a href="https://github.com/tea3/hexo-generator-amp">AMP-Theme</a> designed by <a href="https://github.com/tea3/">tea</a>. | |
| </aside> | |
| </div> | |
| </div> | |
| </footer> | |
| <div id="totop"><a href="#"></a></div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment