html,
body {
	font-family: Helvetica, Arial, sans-serif;
	margin: 0;
	padding: 0
}

html {
	min-height: 100%
}

body {
	background: #CEDBFF;
	min-height: 100%
}

body::-webkit-scrollbar {
    display: none;
}

body#am {
	background: #fff
}

header #logo a img {
	width: 100%;
	height: 100%
}

footer a {
	display: inline
}

#main {
	padding: 1% 2%
}

h1 {
	text-align: center;
	margin: 1% auto
}

ul {
	margin: 0;
	padding: 0
}

li {
	list-style: none
}

ul li {
	float: left
}
ul#post li {
    list-style: disc;
    float: none;
    margin: 10px;
    width: 80%;
    max-width: 1024px;
    margin: 15px auto;
}
ul#postlist li{
	margin-bottom:25px;
}

ul#postlist li a {
	position: relative
}

ul#postlist .posttitle a {
	width: auto;
	height: auto
}

#main a img {
	box-shadow: 0 0 2px #bbb
}

#main.single a img {
	box-shadow: none
}

#main .aligncenter img {
	margin: auto;
	display: block;
	float: none
}

.wrap {
	background: #fff;
	width: 100%;
	position: absolute;
	z-index: 10;
	top: 0;
	left: 0;
	border: 1px solid #ddd;
	border-radius: 4%;
	transform: rotate(4deg)
}

ul#postlist li a img {
	z-index: 12;
	position: relative;
	width: 100%;
	background: #fff;
	border-radius: 4%
}

li,
a,
.wrap,
img {
	transition: all .2s
}

a {
	color: #e24933;
	text-decoration: none;
	width: 100%;
	height: 100%;
	display: block
}

p a {
	display: inline
}

#breadcrumbs a {
	display: inline;
	color:blue
}

#logo {
	float: left
}

#search {
	float: right;
	width: 60%;
	height: 100%;
	max-width: 500px
}

#search form {
	width: 100%;
	height: 100%;
	padding: 0;
	box-shadow: 0 0 10px #e9e7de inset;
	background: #fdfdfc;
	border: 0
}

#search form input {
	border: 0;
	height: 100%;
	width: 80%;
	line-height: 100%;
	background: 0 0
}

#search form button {
	background: url(https://static.coloringall.com/search.svg) no-repeat;
	float: right;
	background-size: auto 100%;
	height: 100%;
	width: 12%;
	border: 0;
	padding: 0
}

button:focus,
input:focus {
	outline: none
}

a:hover {
	color: #e08
}

#main a:hover img,
#main a:hover .wrap {
	box-shadow: inset 0 0 3px #0af;
	background: #fff
}

a:hover .wrap {
	transform: rotate(-4deg)
}

#main img {
	display: block;
	float: left
}

#main.single img {
	background: #f3f2ed
}

figure {
	margin: 0
}

.clear {
	clear: both
}

#main.image {
	padding: .5% 2% 2%
}

.image a {
	text-align: center;
	background: #0a4;
	color: #fff;
	display: block
}

.image a:hover {
	background: #008836
}

#main.page img {
	width: 90%;
	background: 0 0;
	float: none;
	margin: 0 auto
}

p {
	text-align: left;
	line-height: 1.5em
}

.navigation {
	text-align: center
}

.navigation a {
	text-align: center;
	background: #0af;
	color: #fff;
	display: inline
}

.navigation a:hover {
	background: #0a4
}

#notice {
	background-color: #f3f2ed;
	background-image: url(https://static.coloringall.com/green-tick.svg);
	background-size: contain;
	background-repeat: no-repeat;
	overflow: hidden
}

ul#catlist li{
	margin-bottom:25px;
	width: 200px;
}

ul#catlist li a {
	position: relative
}

ul#catlist .cattit a {
	width: auto;
	height: auto
}

ul#catlist li a img {
	z-index: 12;
	position: relative;
	/* width: 100%; */
	background: #fff;
	border-radius: 4%;
	width: 165px;
}

.cattit {
	text-align: center;
}

ul#share li {
    display: inline;
    margin-left: 20px;
    margin-bottom: 9px;
}
ul#share li a{
    color:#000;
}

.yrfa {
	padding: 5px;
	font-size: 15px;
	width: 15px;
	text-align: center;
	text-decoration: none;
	/*margin: 5px 8px;*/
	border-radius: 50%;
	box-sizing: content-box;
}
.myfab {
	padding: 15px;
	font-size: 30px;
	width: 30px;
	text-align: center;
	text-decoration: none;
	margin: 5px 8px;
	border-radius: 50%;
	box-sizing: content-box;
}

.fa-facebook {
	background: #3B5998;
	color: white;
}

.fa-twitter {
	background: #55ACEE;
	color: white;
}

.fa-pinterest {
	background: #cb2027;
	color: white;
}

.fa-instagram {
	background: #125688;
	color: white;
}

.fa-linkedin {
	background: blue;
	color: white;
}

ul.ct-footer li a {
    margin-left: 10px;
    margin-right: 10px;
}

footer > span {margin-left: 20px;float: left;}

footer > ul.ct-footer {
    float: right;
}

@media print {
	html,
	body,
	body#am,
	#main.image,
	#main.image #book,
	#main.image #book #mainimg,
	#main.image #book #mainimg img {
		width: 100%;
		padding: 0;
		height: 100%;
		margin: 0;
		box-shadow: none;
		border-radius: 0;
		background: #fff;
		max-width: 100%;
		max-height: 100%;
		min-width: 100%;
		min-height: 100%
	}
	header,
	footer,
	.image #book #aside,
	.image #book #aside .printabove,
	.image .clear,
	#breadcrumbs,
	#notice,
	.relative {
		display: none!important
	}
}

@media(max-width:599px) {
	a {
		font-size: .12rem
	}
	#main.single li.feed {
		width: 100%;
		height: 100px;
		margin-left: 0;
		margin-right: 0
	}
	#search form input {
		font-size: .14rem;
		padding: 0 0 0 .1rem
	}
	#breadcrumbs {
		font-size: .12rem;
		margin: .1rem
	}
	#breadcrumbs span {
		font-size: .12rem
	}
	header {
		height: .32rem;
		border-bottom: 1px solid #183AAD;
		background: #6084FA;
		overflow: hidden
	}
	header #logo a {
		width: 1.4rem;
		height: .32rem
	}
	footer,
	footer a {
		/*color: #ccc;*/
		font-size: .11rem;
		/*text-align: center;*/
		line-height: .36rem
	}
	.posttitle,
	figcaption {
		font-size: .11rem;
		text-align: center;
		margin-top: .04rem
	}
	#main img {
		border-radius: 4%
	}
	#main.image {
		border-radius: 0
	}
	#main {
		padding: .1rem 0 0;
		font-size: .14rem
	}
	#main .aligncenter img {
		max-width: 90%
	}
	#main.single ul {
		width: 100%;
		overflow: hidden
	}
	#main.single ul li figure {
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0
	}
	#main.single li {
		margin: 2%;
		width: 46%;
		height: 48vw
	}
	#main.single li a,
	#main.single li a img {
		width: 100%;
		height: 42vw;
		border-radius: .08rem
	}
	ul#postlist li {
		width: 42%;
		margin: 4%;
		height: 44vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		width: 100%;
		height: 41vw
	}
	h1 {
		font-size: .2rem
	}
	h2 {
		font-size: .18rem;
		margin: .1rem .2rem
	}
	p {
		font-size: .14rem;
		margin: .1rem .2rem;
		padding: 0
	}
	.image a {
		font-size: .16rem;
		width: .7rem;
		height: .3rem;
		line-height: .3rem;
		border-radius: 8%;
		margin: .1rem auto
	}
	.image img {
		width: 100%;
		max-height: 80vh
	}
	#aside {
		margin-top: .1rem
	}
	#notice {
		width: 78%;
		margin: .2rem auto;
		font-size: .11rem;
		padding: .03rem .06rem .03rem .6rem;
		line-height: .12rem;
		border-radius: .08rem;
		text-align: justify
	}
	.navigation a {
		margin: .06rem;
		padding: .04rem .16rem;
		font-size: .14rem;
		line-height: .2rem;
		border-radius: .03rem
	}
}

@media(min-width:600px) and (max-width:959px) {
	a {
		font-size: .08rem
	}
	#main.single li.feed {
		width: 100%;
		height: 200px;
		margin-left: 0;
		margin-right: 0
	}
	#search form input {
		font-size: .1rem;
		padding: 0 0 0 .1rem
	}
	#breadcrumbs {
		font-size: .07rem;
		margin: .05rem
	}
	header {
		height: .22rem;
		border-bottom: 1px solid #f0f0f0;
		background: #fff;
		overflow: hidden
	}
	header #logo a {
		width: 1rem;
		height: .22rem
	}
	footer,
	footer a {
		color: #ccc;
		font-size: .08rem;
		text-align: center;
		line-height: .14rem
	}
	.posttitle,
	figcaption {
		font-size: .08rem;
		text-align: center;
		margin-top: .03rem
	}
	#main img {
		border-radius: 4%
	}
	.image img {
		width: 100%;
		max-height: 80vh
	}
	#main .aligncenter img {
		max-width: 90%
	}
	#main.single ul {}
	#main.single ul li figure {
		width: 100%;
		height: 100%;
		margin: 0;
		padding: 0
	}
	#main.single li {
		margin: 3%;
		width: 44%;
		height: 44vw
	}
	#main.single li a,
	#main.single li a img {
		width: 100%;
		height: 41vw;
		border-radius: .08rem
	}
	ul#postlist li {
		width: 29.3%;
		margin: 2%;
		height: 34vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		width: 100%;
		height: 29vw
	}
	h1 {
		font-size: .18rem
	}
	h2 {
		font-size: .16rem;
		margin: .1rem .2rem
	}
	p {
		font-size: .1rem;
		margin: .1rem .2rem;
		padding: 0
	}
	.image a {
		font-size: .14rem;
		width: .7rem;
		height: .24rem;
		line-height: .24rem;
		border-radius: 8%;
		margin: .1rem auto
	}
	#notice {
		width: 80%;
		margin: .1rem auto;
		font-size: .07rem;
		padding: .03rem 0 .03rem .54rem;
		line-height: .12rem;
		border-radius: .05rem
	}
	.navigation {
		font-size: .14rem
	}
	.navigation a {
		margin: .2rem;
		padding: .03rem .12rem;
		font-size: .14rem;
		line-height: .18rem;
		border-radius: .05rem
	}
}

@media(min-width:960px) {
	.relative {
		width: 100%;
		max-width: 1200px;
		margin: 10px auto
	}
	#main.single li.feed {
		width: 300px;
		flex-grow: 0;
		background: 0 0
	}
	#main.single li {
		height: 250px;
		background: #f3f2ed
	}
	#main.single li:hover {
		background: #fff;
		box-shadow: inset 0 0 3px #0af;
		border-radius: 10px
	}
	#main.single li a img {
		box-shadow: none;
		border-radius: 0;
		background: 0 0
	}
	#main.single li a,
	#main.single li a img {
		height: 220px
	}
	header {
		height: 40px;
		border-bottom: 1px solid #183AAD;
		background: #6084FA;
		overflow: hidden
	}
	header #logo a {
		width: 200px;
		height: 40px
	}
	#search form input {
		font-size: 18px;
		padding: 0 0 0 10px
	}
	#breadcrumbs {
		font-size: 14px;
		margin: 10px auto 10px 40px
	}
	footer,
	footer a {
		color: #ccc;
		font-size: 14px;
		text-align: center;
		line-height: 36px
	}
	#main.single ul {
		display: flex;
		width: 100%;
		flex-wrap: wrap
	}
	#main.single ul::after {
		content: '';
		display: block;
		flex-grow: 99999
	}
	#main.single li {
		margin: .5%;
		flex-grow: 1
	}
	#main.single li a img {
		border-radius: 15px
	}
	#main.single li a {
		min-width: 220px
	}
	#main.single li a img {
		min-width: 100%;
		max-width: 460px
	}
	.posttitle,
	figcaption {
		font-size: 14px;
		text-align: center;
		margin-top: 6px
	}
	h1 {
		font-size: 24px
	}
	h2 {
		font-size: 20px;
		width: 80%;
		min-width: 900px;
		max-width: 1024px;
		margin: 10px auto
	}
	ul#postlist li {
		margin: 1%
	}
	#notice {
		width: 90%;
		margin: 10px auto;
		max-width: 1200px;
		font-size: 16px;
		padding: 10px 10px 10px 80px;
		line-height: 24px;
		border-radius: 5px
	}
	p {
		width: 80%;
		/*min-width: 900px;*/
		max-width: 1024px;
		margin: 15px auto
	}
	#book {
		box-shadow: rgba(0, 0, 0, .1) 0 1px 10px 0;
		border-radius: 30px;
		width: 100%;
		max-width: 1300px;
		margin: 10px auto;
		overflow: hidden;
		height: 780px;
		max-height: 780px
	}
	.image #book #aside a {
		font-size: 20px;
		line-height: 40px;
		border-radius: 6%;
		text-align: center;
		width: 120px;
		height: 40px;
		margin: auto;
		display: block;
		position: absolute;
		top: 700px;
		left: 0;
		right: 0
	}
	#book #mainimg {
		width: 66%;
		float: left;
		max-height: 780px;
		height: 780px
	}
	#book #aside {
		width: 34%;
		float: right;
		height: 100%;
		position: relative
	}
	.printabove {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		height: 500px;
		max-height: 500px
	}
	.catabove {
		max-width: 1200px;
		margin: auto
	}
	.indexcenter {
		margin: 10px auto;
		max-width: 1200px
	}
	.navigation {
		text-align: center
	}
	.navigation a {
		text-align: center;
		margin: 10px;
		padding: 6px 20px;
		background: #0af;
		color: #fff;
		font-size: 18px;
		line-height: 28px;
		border-radius: 5px;
		display: inline
	}
	.navigation a:hover {
		background: #0a4
	}
	#book h1 {
		margin: 14px;
		float: left;
	}
	#book img {
		width: 100%;
		height: 100%;
		background: #f3f2ed;
		border-radius: none
	}
}

@media(min-width:960px) and (max-width:1199px) {
	ul#postlist li {
		width: 23%;
		height: 25vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		height: 22vw
	}
}

@media(min-width:1200px) {
	#main.index {
		max-width: 1230px;
		margin: auto;
		padding: 1% 0
	}
	ul#postlist li {
		width: 14.6%
	}
}

@media(min-width:1200px) and (max-width:1323px) {
	ul#postlist li {
		height: 15.7vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		height: 14vw
	}
}

@media(min-width:1324px) and (max-width:1403px) {
	ul#postlist li {
		height: 14.8vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		height: 13.1vw
	}
}

@media(min-width:1404px) and (max-width:1487px) {
	ul#postlist li {
		height: 14vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		height: 12.5vw
	}
}

@media(min-width:1488px) and (max-width:1567px) {
	ul#postlist li {
		height: 13.2vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		height: 11.7vw
	}
}

@media(min-width:1568px) and (max-width:1759px) {
	ul#postlist li {
		height: 12.6vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		height: 11.2vw
	}
}

@media(min-width:1760px) {
	ul#postlist li {
		height: 10.5vw
	}
	#postlist a,
	#postlist img,
	#postlist .wrap {
		height: 9.3vw
	}
}

@media(min-width:901px) and (max-width:959px) {
	html {
		font-size: 245px
	}
}

@media(min-width:851px) and (max-width:900px) {
	html {
		font-size: 235px
	}
}

@media(min-width:823px) and (max-width:850px) {
	html {
		font-size: 222.4px
	}
}

@media(min-width:806px) and (max-width:822px) {
	html {
		font-size: 216px
	}
}

@media(min-width:785px) and (max-width:805px) {
	html {
		font-size: 213.33px
	}
}

@media(min-width:741px) and (max-width:784px) {
	html {
		font-size: 204.8px
	}
}

@media(min-width:716px) and (max-width:740px) {
	html {
		font-size: 192px
	}
}

@media(min-width:701px) and (max-width:715px) {
	html {
		font-size: 189.87px
	}
}

@media(min-width:661px) and (max-width:700px) {
	html {
		font-size: 180px
	}
}

@media(min-width:621px) and (max-width:660px) {
	html {
		font-size: 170px
	}
}

@media(min-width:581px) and (max-width:620px) {
	html {
		font-size: 160px
	}
}

@media(min-width:550px) and (max-width:580px) {
	html {
		font-size: 150px
	}
}

@media(min-width:515px) and (max-width:549px) {
	html {
		font-size: 142.4px
	}
}

@media(min-width:480px) and (max-width:514px) {
	html {
		font-size: 129.33px
	}
}

@media(min-width:453px) and (max-width:479px) {
	html {
		font-size: 125.6px
	}
}

@media(min-width:430px) and (max-width:452px) {
	html {
		font-size: 115.2px
	}
}

@media(min-width:426px) and (max-width:429px) {
	html {
		font-size: 113.87px
	}
}

@media(min-width:420px) and (max-width:425px) {
	html {
		font-size: 113.07px
	}
}

@media(min-width:413px) and (max-width:419px) {
	html {
		font-size: 110.4px
	}
}

@media(min-width:405px) and (max-width:412px) {
	html {
		font-size: 109.87px
	}
}

@media(min-width:391px) and (max-width:404px) {
	html {
		font-size: 104.8px
	}
}

@media(min-width:381px) and (max-width:390px) {
	html {
		font-size: 102.4px
	}
}

@media(min-width:370px) and (max-width:380px) {
	html {
		font-size: 100px
	}
}

@media(min-width:357px) and (max-width:369px) {
	html {
		font-size: 96px
	}
}

@media(min-width:352px) and (max-width:356px) {
	html {
		font-size: 94.13px
	}
}

@media(min-width:338px) and (max-width:351px) {
	html {
		font-size: 93.6px
	}
}

@media(max-width:337px) {
	html {
		font-size: 85.33px
	}
}