/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html {
	font-family: sans-serif;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%
}

body {
	margin: 0
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,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-color: 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 {
	box-sizing: content-box;
	height: 0
}

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;
	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
}

::-moz-selection {
	color: #FFFFFF;
	background-color: #727cf5
}

::selection {
	color: #FFFFFF;
	background-color: #727cf5
}

html,body {
	width: 100%;
	height: 100%
}

body {
	margin: 0;
	color: #34495e;
	font-size: 15px;
	line-height: 1.6;
	background-color: #fff;
	font-family: 'sourcesanspro', 'Helvetica Neue', Arial, sans-serif
}

ul.nav,ul.post-list {
	margin: 0;
	padding: 0;
	list-style-type: none
}

ul {
	margin: 1rem 0
}

a,a:active {
	color: #2c3e50;
	text-decoration: none
}

a.nav-list-link.active,a.nav-list-link:hover,a.post-title-link:hover {
	border-bottom: 2px solid #727cf5
}

hr {
	border: 0
}

code {
	margin: 0 2px;
	padding: 3px 5px;
	color: #e96900;
	border-radius: 2px;
	white-space: inherit
}

iframe,video {
	max-width: 100%;
	margin: 1rem auto;
	display: block
}

table {
	width: 100%;
	margin: 1em auto
}

table thead {
	background-color: #ddd
}

table thead th {
	padding: 5px;
	min-width: 20px
}

table tbody tr:nth-child(2n) {
	background-color: #eee
}

table tbody td {
	padding: 5px;
	vertical-align: text-top
}

header {
	min-height: 60px
}

header .logo-link {
	float: left
}

header .nav {
	float: right;
	left: 80px
}

header .logo-link img {
	height: 60px
}

header .nav-list-item {
	display: inline-block;
	padding: 19px  10px
}

header .nav-list-item a {
	font-size: 16px;
	line-height: 1.4
}

.home.post-list {
	margin: 2em 0
}

.home.post-list .post-list-item {
	padding: 1em 0 2em;
	border-bottom: 1px solid #ddd
}

.home.post-list .post-list-item:last-child {
	border-bottom: 0px
}

.home.post-list .post-content h2:before,.home.post-list .post-content h3:before,.home.post-list .post-content h4:before,.home.post-list .post-content h5:before,.home.post-list .post-content h6:before {
	content: ''
}

.home.post-list .post-content>ul {
	list-style: initial
}

.home.post-list .read-more {
	color: #727cf5
}

.archive {
	max-width: 500px;
	margin: 5em auto
}

.archive .post-item {
	padding: 2px 0 0 50px
}

.archive .post-time,.archive .post-title-link {
	font-size: 1rem
}

.archive .post-title-link {
	display: block;
	margin-left: 125px;
	color: #727cf5;
	word-break: break-all
}

.archive .post-title-link:hover {
	border-bottom: 0;
	color: #267B54
}

.archive .post-info {
	float: left;
	width: 125px;
	color: #7f8c8d
}

.post {
	padding-top: 1em
}

.post-block .post-title {
	margin: 0.65em 0;
	color: #2c3e50;
	font-size: 1.5em
}

.post-block .post-info {
	color: #7f8c8d;
	margin: 1.2em 0
}

.post-block .post-info span {
	margin-left: 0.5rem
}

.post-block .post-info a.post-from {
	margin-left: 0.5rem;
	padding: 3px 6px;
	border-radius: 5px;
	font-size: 12px;
	color: white;
	background-color: #E36B6B
}

.post-content h2,.post-content h3,.post-content h4,.post-content h5,.post-content h6 {
	position: relative;
	margin: 1em 0
}

.post-content h2:before,.post-content h3:before,.post-content h4:before,.post-content h5:before,.post-content h6:before {
	content: "#";
	color: #727cf5;
	position: absolute;
	left: -0.7em;
	top: -4px;
	font-size: 1.2em;
	font-weight: bold
}

.post-content h4:before,.post-content h5:before,.post-content h6:before {
	content: ""
}

.post-content h2,.post-content h3 {
	font-size: 22px
}

.post-content h4,.post-content h5,.post-content h6 {
	font-size: 18px
}

.post-content a {
	color: #727cf5;
	word-break: break-all
}

.post-content blockquote {
	margin: 2em 0;
	padding-left: 20px;
	border-left: 4px solid #727cf5
}

.post-content img {
	/* display: block;
	max-width: 100%;
	margin: 1em auto */
	border-radius: 6px;
    display: block;
    margin: 1em auto;
    max-width: 100% !important;
    object-fit: contain;
    box-shadow: rgb(170 170 170 / 48%) 0px 0px 6px 0px;

}

.post-content>table,.post-content>figure.highlight {
	box-shadow: 0 1px 2px rgba(0,0,0,0.125)
}

.post-content .tip {
	position: relative;
	margin: 2em 0;
	padding: 12px 24px 12px 30px;
	border-left: 4px solid #f66;
	border-top-right-radius: 2px;
	border-bottom-right-radius: 2px;
	background-color: #f8f8f8
}

.post-content .tip br {
	display: none
}

.post-content .tip:before {
	position: absolute;
	top: 14px;
	left: -12px;
	content: "!";
	width: 20px;
	height: 20px;
	border-radius: 100%;
	color: #fff;
	font-size: 14px;
	line-height: 20px;
	font-weight: bold;
	text-align: center;
	background-color: #f66;
	font-family: 'Dosis', 'Source Sans Pro', 'Helvetica Neue', Arial, sans-serif
}

#mask {
	position: fixed;
	overflow: scroll;
	width: 100%;
	height: 100%;
	padding: 1em 0;
	background-color: rgba(0,0,0,0.5);
	z-index: 10
}

#mask #mask-image {
	max-width: 95%
}

code,pre {
	font-size: 0.8em;
	background-color: #f8f8f8;
	font-family: 'Roboto Mono', Monaco, courier, monospace
}

.highlight {
	position: relative;
	margin: 1em 0;
	border-radius: 2px;
	line-height: 1.1em;
	background-color: #f8f8f8;
	overflow-x: auto
}

.highlight table,.highlight tr,.highlight td {
	width: 100%;
	border-collapse: collapse;
	padding: 0;
	margin: 0
}

.highlight .gutter {
	display: none
}

.highlight .code pre {
	padding: 1.2em 1.4em;
	line-height: 1.5em;
	margin: 0
}

.highlight .code pre .line {
	width: auto;
	height: 18px
}

.highlight.html .code:after,.highlight.js .code:after,.highlight.bash .code:after,.highlight.css .code:after,.highlight.scss .code:after,.highlight.diff .code:after,.highlight.java .code:after,.highlight.xml .code:after,.highlight.python .code:after,.highlight.json .code:after,.highlight.swift .code:after,.highlight.ruby .code:after,.highlight.perl .code:after,.highlight.php .code:after,.highlight.c .code:after,.highlight.cpp .code:after,.highlight.ts .code:after {
	position: absolute;
	top: 0;
	right: 0;
	color: #ccc;
	text-align: right;
	font-size: 0.75em;
	padding: 5px 10px 0;
	line-height: 15px;
	height: 15px;
	font-weight: 600
}

.highlight.html .code:after {
	content: "HTML"
}

.highlight.js .code:after {
	content: "JS"
}

.highlight.bash .code:after {
	content: "BASH"
}

.highlight.css .code:after {
	content: "CSS"
}

.highlight.scss .code:after {
	content: "SCSS"
}

.highlight.diff .code:after {
	content: "DIFF"
}

.highlight.java .code:after {
	content: "JAVA"
}

.highlight.xml .code:after {
	content: "XML"
}

.highlight.python .code:after {
	content: "PYTHON"
}

.highlight.json .code:after {
	content: "JSON"
}

.highlight.swift .code:after {
	content: "SWIFT"
}

.highlight.ruby .code:after {
	content: "RUBY"
}

.highlight.perl .code:after {
	content: "PERL"
}

.highlight.php .code:after {
	content: "PHP"
}

.highlight.c .code:after {
	content: "C"
}

.highlight.java .code:after {
	content: "JAVA"
}

.highlight.cpp .code:after {
	content: "CPP"
}

.highlight.ts .code:after {
	content: "TS"
}

.highlight.cpp .code:after {
	content: 'C++'
}

pre {
	color: #525252
}

pre .function .keyword,pre .constant {
	color: #0092db
}

pre .keyword,pre .attribute {
	color: #e96900
}

pre .number,pre .literal {
	color: #ae81ff
}

pre .tag,pre .tag .title,pre .change,pre .winutils,pre .flow,pre .lisp .title,pre .clojure .built_in,pre .nginx .title,pre .tex .special {
	color: #2973b7
}

pre .symbol,pre .symbol .string,pre .value,pre .regexp {
	color: #727cf5
}

pre .title {
	color: #83B917
}

pre .tag .value,pre .string,pre .subst,pre .haskell .type,pre .preprocessor,pre .ruby .class .parent,pre .built_in,pre .sql .aggregate,pre .django .template_tag,pre .django .variable,pre .smalltalk .class,pre .javadoc,pre .django .filter .argument,pre .smalltalk .localvars,pre .smalltalk .array,pre .attr_selector,pre .pseudo,pre .addition,pre .stream,pre .envvar,pre .apache .tag,pre .apache .cbracket,pre .tex .command,pre .prompt {
	color: #727cf5
}

pre .comment,pre .java .annotation,pre .python .decorator,pre .template_comment,pre .pi,pre .doctype,pre .shebang,pre .apache .sqbracket,pre .tex .formula {
	color: #b3b3b3
}

pre .deletion {
	color: #BA4545
}

pre .coffeescript .javascript,pre .javascript .xml,pre .tex .formula,pre .xml .javascript,pre .xml .vbscript,pre .xml .css,pre .xml .cdata {
	opacity: 0.5
}

.paginator {
	margin: 4em 0;
	text-align: center
}

.paginator .prev,.paginator .next {
	display: inline-block;
	margin: 0 4px;
	padding: 4px 12px;
	border-radius: 4px;
	border-bottom: 4px solid #3aa373;
	font-size: 14px;
	color: #fff;
	background-color: #4fc08d
}

.paginator .prev:hover,.paginator .next:hover {
	background-color: #22bd77
}

.ds-thread,#disqus_thread {
	margin-bottom: 2em
}



@media screen and (min-width: 700px) {
	.wrap {
		width: 700px;
		margin: 0 auto
	}

	header {
		padding: 20px 0px 20px 20px;
	}
}

@media screen and (max-width: 700px) {
	.wrap {
		width: 100%
	}

	header {
		padding: 20px 0
	}

	header a.logo-link,header ul.nav.nav-list {
		float: none;
		display: block;
		text-align: center
	}

	header li.nav-list-item {
		padding: 10px 10px
	}

	main.container,.home.post-list,.archive {
		margin-top: 0
	}

	.archive .post-item {
		padding-left: 20px
	}

	.post-content h2,.post-content h3,.post-content h4,.post-content h5,.post-content h6 {
		max-width: 300px;
		left: 15px
	}

	.ds-thread,#disqus_thread {
		margin: 2em 10px
	}
}

footer {
	padding-bottom: 1px
}

footer .copyright {
	margin: 4em 0;
	/* border-top: 1px solid #ddd; */
	text-align: left
}

footer .copyright p,footer .copyright a {
	color: #aaa;
	font-size: 14px;
	font-weight: 100
}

footer .copyright a:hover {
	color: #888
}

@font-face {
	font-family:'sourcesanspro';src:url("../font/sourcesanspro.woff2") format("woff2"),url("../font/sourcesanspro.woff") format("woff");font-weight:normal;font-style:normal
}

.tags-list a {
	margin-right: 8px;
}

.tags-cloud {
	padding: 40px;
}

.tags-cloud a {
	margin-right: 10px;
}

.links a {
	color: #727cf5;
}

header .logo-link img {
	height: 50px;
	border-radius: 25px;
	margin-right: 10px;
	vertical-align: middle
}

header .logo-link {
	font-weight: bold
}

header .logo-link {
	float: left;
	margin-top: 10px;
}