/*************************************************首页文字样式***************************************************/
.home-blog .hero .description {
    font-size: 2.2rem !important;
    font-family: '楷体' !important;
    color: ivory !important;
}
/*************************************************整体样式***************************************************/
body {
    font-family: Ubuntu, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 15px;
    color: var(--text-color);
    background-color: var(--background-color) !important;
	background-image: linear-gradient(to left, rgba(255, 0, 149, 0.2), rgba(0, 247, 255, 0.2));
}

/*************************************************显示页面的最大宽度***************************************************/

.page .page-title, .page .page-edit, .page .comments-wrapper, .page-nav, .page-title, .content__default:not(.custom) {
	max-width: 1500px !important;
}

/******************************************************显示页面的引用样式**********************************************/
.page blockquote {
	border-left: 0.4rem solid #42b983 !important;
	color: #24292e !important;
}

.dark .page blockquote {
	border-left: 0.4rem solid #42b983 !important;
	color: cornsilk !important;
}
	

/*引用>样式中的h3样式*/
.page blockquote h3 {
	margin-top: 1rem !important;
	line-height: 0.25 !important;
	font-size: 1.0rem !important;
}
/*****************************************************导航左侧********************************************/
/*导航最左侧的文字样式*/
.navbar .site-name {
	font-family:'STXingkai';
	font-size: 1.9rem !important;
    background: -webkit-linear-gradient(45deg,#70f7fe,#fbd7c6,#fdefac,#bfb5dd,#bed5f5) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-animation: run 3s linear 0s infinite normal none running !important;
    animation: run 3s linear 0s infinite normal none running !important;
    margin-left: -8px;
}
/*导航左侧的图标*/
.navbar .site-name:before {
	display: inline-block;
	content: '';
	width: 2.5rem;
	height: 2.5rem;
	background: url(../img/logo.gif) no-repeat;
	margin: 0rem 0.7rem 0.5rem 0.4rem;
	background-size: 100% 100%;
	border-radius: 50%;
	vertical-align: middle;
}

/********************************************导航栏样式***************************************************/
.navbar {
	background: linear-gradient(90deg,#91eae4,#86a8e7,#7f7fd5) !important
}
header .links {
    background-color: transparent !important;
}
.nav-links a {
    font-weight: bold;
}
.navbar .links{
	right: 3.5rem !important;
}

.navbar .links .nav-links .nav-item i {
    font-weight: bolder !important;
    color:black ;
}
.dark .navbar .links .nav-links .nav-item i {
    color:white ;
}

.navbar .links .nav-links .nav-item a {
    font-size: 14.5px !important;
}
/*****************************************文章左侧边栏**************************************/
.sidebar {
	background-color: transparent !important;
}
.sidebar ul.sidebar-links > li {
    background: transparent !important;
}
a.sidebar-link{
	background: transparent !important;
}
.sidebar-group{
	 background: transparent !important;
}
a.sidebar-link.active {
    font-size: 19px;
	font-weight: bolder;
}
.sidebar > .sidebar-links li a:hover{
	color: #0567f1;
	font-size: 19px;
	font-weight:bold;
}

/****************************************文章右侧边栏样式*****************************************/
.sub-sidebar-wrapper li a{
	background-color: transparent;
	font-size: 14px;
	white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sub-sidebar-wrapper li.active a{
	font-size: 16px;
	font-weight: bolder;
	white-space: normal;
}

.sub-sidebar-wrapper li a:hover{
	color: #42b983;
	font-size: 14px;
	font-weight: bolder;
	white-space: normal;
}
.sub-sidebar-wrapper li.level-3 {
    padding-left: 2.2rem !important;
}
.sub-sidebar-wrapper li.level-2 {
    padding-left: 0.7rem !important;
}
/**********************************标签列表样式********************************/

.abstract-item .title a{
	color: black !important;
}
.dark .abstract-item .title a{
	color: blue !important;
}
.abstract-item {
  background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%) !important;
  transition: all .5s;
}
.abstract-item:hover {
    transform:  scale(1.02);
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22) !important;
}
.abstract-item:hover .cover-img{
	transform: scale3d(1.3, 1.3, 1);
}
.abstract-item > *[data-v-4e307670]{
	text-align: center;
}
.abstract-item .info .reco-account{
	font-size: 15px;
	font-weight: bolder;
	color: #ff5f56;
	margin-left: 0px;
}
.abstract-item .info .reco-date{
	font-size: 15px;
	font-weight: bolder;
	color: #ffbd2e;
}
.abstract-item .info .reco-tag{
	font-size: 15px;
	font-weight: bolder;
	color: #27c93f;
}
.abstract-item .info i span{
	font-size: 13px;
	font-weight: bolder;
	color: #3498DB;
}
.abstract-item{position:relative}
.abstract-item:after{ 
	position:absolute; content:''; border:3px dashed transparent;
	width:0; height:0; z-index:0; left: -6px; top: 0;
	transition: border-color  0s  ease-in 0.8s , width 0.2s ease-in 0.6s, height 0.2s ease-in 0.4s;
	-webkit-transition: border-color  0s  ease-in 0.8s , width 0.2s ease-in 0.6s, height 0.2s ease-in 0.4s;
}
.abstract-item:before{
	position:absolute; content:''; border:3px dashed transparent;
	box-sizing: border-box;
	width:0; height:0; z-index:0; bottom: 0; right: 0px;
	transition: border-color 0s ease-in 0.4s, width 0.2s ease-in 0.2s, height 0.2s ease-in ;
	-webkit-transition: border-color 0s ease-in 0.4s, width 0.2s ease-in 0.2s, height 0.2s ease-in ;
 }
 /* 悬浮时的变化*/
.abstract-item:hover:before{
	width:100%; 
	height:100%; 
	border-bottom-color:#e4393c;
	border-left-color:#4e393c;
	transition:border-color 0s ease-out 0.4s, width 0.2s ease-out 0.4s, height 0.2s ease-out 0.6s;
	-webkit-transition:  border-color 0s ease-out 0.4s, width 0.2s ease-out 0.4s, height 0.2s ease-out 0.6s ;
}
.abstract-item:hover:before{
	width:100%; 
	height:100%; 
	border-top-color:#e4933c;
	border-right-color: purple;
	transition: width 0.2s ease-out, height 0.2s ease-out 0.2s;
	-webkit-transition:width 0.2s ease-out, height 0.2s ease-out 0.2s;
}

/*******************************************文章背景色****************************************************/
/*亮色*/
.theme-reco-content{
	background: #F5F5D5;
}

/*暗色*/
.dark .theme-reco-content{
	background: #223858;
}

.dark a, p a code{
	color: #1bdc86;
}

/***********************************文章中图片样式****************************/
.content__default:not(.custom) img{
	border-radius: 1%
}

/***********************************文章信息样式*********************************************/
.page .page-title{

}
.page .page-title h1{
  font-size: 35px;
  text-align: center;
  color:black;
}
.page .theme-reco-content h4 {
    font-size: 1rem !important;
	font-weight: 700 !important;
}

/*暗色*/
.dark .page .page-title h1{
  color:white;
}
.page .page-title div{
	text-align: center;
}

.page .page-title div i{
	font-size: 14px;
	font-weight: bolder;
}
.dark .page .page-title div i{
	color: white;
}

.page .page-title div i span a{
	font-size: 14px !important;
	color:black !important;
}
.dark .page .page-title div i span a{
	color:white !important;
}

/*亮色*/
.content__default pre code{
	color: #9adbbe !important;
}
.content__default code {
    color: blue !important;
}
/*暗色*/
.dark .content__default code{
	color: wheat !important;
}

/****************************************滚动条样式****************************************/
::-webkit-scrollbar{
	width: 6px !important;
	border-radius: 10px !important;
    background-color: #F5F5F5 !important;
}
::-webkit-scrollbar-thumb {
	background-image: linear-gradient(to top, #fa709a 0%, #fee140 100%) !important;
	background-clip:padding-box !important;
	-webkit-border-radius: 10em !important;
	-moz-border-radius: 10em !important;
	border-radius: 10em !important;
	transition: 0.3s ease-in-out !important;
}
::-webkit-scrollbar-track-piece {
	background-color:transparent !important;
	-webkit-border-radius: 0em !important;
	-moz-border-radius: 0em !important;
	border-radius: 0em !important;
}
::-webkit-scrollbar-thumb:hover {
	background-image: linear-gradient(120deg, #f093fb 0%, #f5576c 100%) !important;
    transition: 0.3s ease-in-out !important;
}


/**************************************时间线样式*********************************************/
.timeline-content .desc{
	font-size: 30px !important;
}
.timeline-content .desc span{
	font-size: 40px !important;
	color: green;
	font-weight: bolder;
}
.timeline-wrapper .year {
  margin: 80px 0px 20px !important;
  font-size: 27px !important;
}
.timeline-wrapper .year-wrapper li {
    padding: 10px 20px 10px !important;
    border-bottom: 2px solid #999da06b !important;
    background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);
    border-radius: 5rem;
    margin: 5px 0px;
    transition: all .5s;
	font-weight: bolder;
	margin-top: 1.5rem;
}
.timeline-wrapper .timeline-content .year-wrapper li .title[data-v-d991a5a8]{
	color: #fda085 !important;
}
.timeline-wrapper .year-wrapper li:hover {
    transform:  translate(50px,0);
    transition: all .5s;
}
.timeline-wrapper .year-wrapper li .date {
  width: 43px !important;
  font-size: 13px !important;
}
.timeline-wrapper .year-wrapper li .date:before {
    top: 22px !important;
    border: 1px solid !important;
}
.timeline-wrapper:after {
    background: skyblue !important;
}
.timeline-wrapper .desc:before, .timeline-wrapper .year:before {
  background: cadetblue !important;
}

/***********************************************分页框样式*********************************************/
.pagation{
	background: transparent !important;
}
.pagation .jump{
	border-radius: 50% !important;
	transition: all 0.5s ease !important;
}
.pagation .jump:hover {
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22) !important;
	background: #F37D7C;
	color: #fff;
}
.dark .pagation .jumpinp input{
	color: white !important;
}

/*********************************************页脚样式****************************************************/
.footer{
	background-color: #3c585a;
}
.footer i{
	color: white;
	font-size: 15px;
}
.footer a:hover{
	color: white;
}