*{box-sizing:border-box}html,body,h1,h2,h3{margin:0;padding:0}
body{background:var(--t-c-bg);font-family:var(--t-font-family-base);color:var(--t-c-text-1);}
a{color:var(--t-c-text-1);text-decoration:none}
a.external::after{
  content: "";display:inline-block;
  margin-top: -1px;
  margin-left: 4px;
  width: 11px;
  height: 11px;
  background: currentColor;
  color: var(--t-c-text-3);
  flex-shrink: 0;
  --icon: url("data:image/svg+xml, %3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' %3E%3Cpath d='M0 0h24v24H0V0z' fill='none' /%3E%3Cpath d='M9 5v2h6.59L4 18.59 5.41 20 17 8.41V15h2V5H9z' /%3E%3C/svg%3E");
  -webkit-mask-image:var(--icon);mask-image:var(--icon);
}

.wp{max-width:1320px;margin:0 auto;overflow:hidden}
header{position:fixed;top:0;left:0;width:100%;z-index:30;transition:background-color .5s;height:64px;background-color:var(--t-c-bg);border-bottom:1px solid var(--t-c-gutter)}
header.top{background:transparent;border:0}
header .container{display:flex;justify-content:space-between}
header .title{height:64px;line-height:64px}
header .content{height:64px;line-height:64px}
header .content a{padding:0 10px;color:var(--t-c-text-1)}header .content a.external{padding-right:5px}
header .nav{background-color:transparent}
header #nav{display:inline-block}

.t_switch{
	margin-left:10px;cursor:pointer;position:relative;top:-6px;border-radius:11px;display:inline-block;width:40px;height:22px;
	border:1px solid var(--t-c-border);background-color:var(--t-c-bg-3);transition:border-color .25s !important;
}
.t_switch:hover{border-color:var(--t-c-main)}
.t_switch .check{
	position:absolute;top:1px;left:1px;width:18px;height:18px;border-radius:50%;background-color:var(--t-c-bg-4);
	box-shadow:0 1px 2px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06);transition:transform .25s !important;
}
.dark .t_switch .check{transform:translate(18px)}
.t_switch .icon{position:relative;display:block;width:18px;height:18px;border-radius:50%;overflow:hidden}
.t_switch .icon .t_i{
	position:absolute;top:3px;left:3px;width:12px;height:12px;color:var(--t-c-text-1);mask:var(--icon) no-repeat;-webkit-mask:var(--icon) no-repeat;mask-size:100% 100%;-webkit-mask-size:100% 100%;background-color:currentColor;
}
.t_switch .icon .sun{
	--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M6.34 17.66l-1.41 1.41M19.07 4.93l-1.41 1.41'/%3E%3C/svg%3E");
	opacity:1;
}
.dark .t_switch .icon .sun{opacity:0}
.t_switch .icon .moon {
	--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath d='M12 3a6 6 0 0 0 9 9 9 9 0 1 1-9-9Z'/%3E%3C/svg%3E");
	opacity:0;
}
.dark .t_switch .icon .moon{opacity:1}

footer{padding:32px;border-top:1px solid var(--t-c-gutter);text-align:center;line-height:24px;font-size:14px;font-weight:200;color:var(--t-c-text-2);margin-top:2rem}

.cover{display:flex;justify-content:space-between;margin-top:5.5rem}
.cover .pic{position:relative;top:-20px;display:none}
.cover .pic img{height:200px;border-radius:10px}

.brand{margin:0 10px 10px;font-size:2.5rem;line-height:1;font-weight:700;letter-spacing:3px;display:inline-block}
.brand2{margin:10px 10px 30px;font-size:1.5rem;font-weight:200;display:inline-block}
.accent{
    background:var(--t-home-hero-name-background);
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent
}

.ch{
	--stripes: repeating-linear-gradient( 100deg, #fff 0%, #fff 7%, transparent 10%, transparent 12%, #fff 16% );
	--stripesDark: repeating-linear-gradient( 100deg, #000 0%, #000 7%, transparent 10%, transparent 12%, #000 16% );
	--rainbow: repeating-linear-gradient( 100deg, #60a5fa 10%, #e879f9 15%, #60a5fa 20%, #5eead4 25%, #60a5fa 30% );
	background-image: var(--stripes),var(--rainbow);
	background-size: 300%,200%;
	background-position: 50% 50%,50% 50%;
	filter: blur(10px) invert(100%);
	-webkit-mask-image: radial-gradient(ellipse at 100% 0%,black 40%,transparent 70%);
	mask-image: radial-gradient(ellipse at 100% 0%,black 40%,transparent 70%);
	pointer-events: none;
    opacity: .5;
    position: fixed;
    z-index:-1;
    top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}
.dark .ch{
    background-image: var(--stripesDark),var(--rainbow);
    filter: blur(10px) opacity(50%) saturate(200%);
}
.ch::after {
	content: "";
	position: absolute;
    z-index:-1;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-image: var(--stripes),var(--rainbow);
	background-size: 200%,100%;
	animation: jumbo 60s linear infinite;
	background-attachment: fixed;
	mix-blend-mode: difference;
}
.dark .ch::after{
    background-image: var(--stripesDark),var(--rainbow);
}
@keyframes jumbo {
  0% {
    background-position:50% 50%,50% 50%
  }
  to {
    background-position:350% 50%,350% 50%
  }
}
button{margin:0;padding:0;border:0;background-color:transparent;background-image:none}
#hamburger{-webkit-appearance:button;cursor:pointer;width:48px;height:64px;display:none;justify-content:center;align-items:center}
#hamburger .container{position:relative;width:16px;height:14px;overflow:hidden}
#hamburger .top,#hamburger .middle,#hamburger .bottom{position:absolute;width:16px;height:2px;background-color:var(--t-c-text-1);transition:top .25s,background-color .5s,transform .25s}
#hamburger .top{top:0;left:0;transform:translate(0)}
#hamburger .middle{top:6px;left:0;transform:translate(8px)}
#hamburger .bottom{top:12px;left:0;transform:translate(4px)}
#hamburger:hover .top{transform:translate(4px)}#hamburger:hover .middle{transform:translate(0)}#hamburger:hover .bottom{transform:translate(8px)}
#hamburger.active .top{top:6px;transform:translate(0) rotate(225deg)}
#hamburger.active .middle{top:6px;transform:translate(16px)}
#hamburger.active .bottom{top:6px;transform:translate(0) rotate(135deg)}


.main{display:flex;}
.main .content,.main aside{
    flex: 0 0 auto;
    padding: 0 .5rem;
}
.main .content{width:70%}

.content .article,.widget,.content .post{background-color:var(--bg-block);border:1px solid var(--border-block);border-radius:8px}

.content .article{display:flex;align-items:flex-start;position:relative;padding:1rem;margin-bottom:1rem;overflow:hidden}
.content .article .thumb{flex-shrink:0;margin-right:1.25rem;width:25%;max-width:217px;max-height:145px;border-radius:6px;overflow:hidden;position:relative}
.content .article .thumb img{width:100%;max-height:100%;display:block;transition:all 300ms ease-in-out}
.content .article .thumb .item-badge{
    position: absolute;
    left: 0;
    top: 0;
    font-size: .6875rem;
    line-height: 1.3;
    padding: .125rem .375rem;
    color: #fff;
    background-color: rgb(0 0 0/60%);
    border-top-left-radius: inherit;
    border-bottom-right-radius: 7px;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
    display:none
}
.content .article .thumb .item-badge.top {
  background: linear-gradient(to right,#ff6737,#ff9f46);
}
.content .article:hover .thumb img{transform:scale(1.05)}
.content .article .body{display:flex;flex-direction:column;justify-content:center;flex:1 1 auto;padding:.25rem 0}
.content .article .sticky{
    position: absolute;
    width: 100px;
    height: 0;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 30px solid #ff5d34;
    transform: rotate(-315deg);
    top: 10px;
    right: -25px;
    color: #fff;
    font-size: 13px;
    text-align: center;
    line-height: 28px;
}
.content .article h2{font-size:1.25rem;font-weight:400;line-height:1.4}
.content .article .excerpt{margin-top:1.25rem;overflow:hidden;text-overflow:ellipsis;color:#a2a6b1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.content .article .meta{display:flex;justify-content:space-between;margin-top:1.25rem;font-size:.8125rem}
aside{width:30%;flex:0 0 auto;padding:0 .5rem}

.widget{
    padding: 1.25rem;
    margin-bottom: 1rem;
}
.widget h2{position:relative;font-weight:700;margin:0 0 1rem;padding-left:25px;font-size:1.0625rem;line-height:1.4}
.widget-border {
  position: absolute;
  top: -3px;
  left: 0;
  width: 36px;
  height: 30px;
  border-radius: 4px;
}
.widget-border::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 3px;
  height: 18px;
  border-radius: 10px;
  background-color: #3858f6;
  opacity: 1;
  transform: translateY(-50%) rotate(15deg);
  transition: all .4s ease-in-out;
}
.widget-border::after {
  content: '';
  position: absolute;
  left: 8px;
  top: 50%;
  width: 3px;
  height: 16px;
  border-radius: 10px;
  background-color: #3858f6;
  opacity: .6;
  transform: translateY(-50%) rotate(15deg);
  transition: all .4s ease-in-out;
}
.widget:hover .widget-border:before,.widget:hover .widget-border:after{transform:translateY(-50%) rotate(-165deg)}
.list-overlay .list-item {
	position: relative;
    overflow: hidden;
    border-radius: 8px;
    margin: 0 0 1rem;
}
.media-content {
    transition: all 300ms ease-in-out;
}
.media-content img{display:block;width:100%}
.list-item:hover .media-content {
    transform: scale(1.05);
}
.overlay-1 {
	width: 100%;
	height: 100%;
	background-color: #20232b;
	position: absolute;
	opacity: .4;
	top: 0;
	left: 0;
	transition: opacity .3s ease-in-out;
}
.list-item:hover .overlay-1{opacity:.6}
.list-overlay .list-content {
    display: block;
    position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	padding: 1rem 1.25rem;
    font-size: 1.25rem;
	color: #fff;
    display: flex;
    align-items: center;
    z-index:1;
}
ul.contacts{margin:0 -.75rem;padding:0 1rem}
.contacts li{list-style:none;font-size:.875rem;padding:.75rem 0;border-top:1px solid rgba(38,38,38,0.05)}
ul.links{display:flex;flex-wrap:wrap;margin:0 -.75rem;padding:0 1rem}
.links li{list-style:none;flex:0 0 auto;width:50%;font-size:.875rem;padding:.75rem 0;border-top:1px solid rgba(38,38,38,0.05)}


@media (max-width: 1023px) {
    .main{flex-direction:column}
    .main .content,aside{width:100%}
    .content .article .thumb{width:33.33%}
    .widget .article .thumb,.widget .article .meta{display:none}
}
@media(max-width:767px){
    .wp{width:95%}
    .list{margin:20px 0 15px}
    .list .e{width:100%;margin-right:0}
    header .content #nav:not(.active){display:none}
    #hamburger{display:inline-flex}
    #nav.active{position:fixed;top:0;right:0;bottom:0;left:0;padding-top:88px;width:100%;background-color:var(--t-c-bg);overflow-y:auto;text-align:center}
    #nav.active a{display:block;border-bottom:1px solid var(--t-c-divider);padding:12px 0 11px;line-height:24px;font-size:14px;font-weight:500;max-width:288px;margin:auto;text-align:left}
    #main.hidden,#footer.hidden,#ch.hidden{display:none}
    footer .row{display:block}
    .content .article .excerpt{display:none}
    .content .article h2{font-size:1rem}
    .content .article .sticky{display:none}
    .content .article .thumb .item-badge{display:block}
    .content .post{padding:.875rem}
    .brand2{display:none}
    .brand{margin-bottom:2rem;font-size:2rem}
    .cover{margin-top:4.5rem}
}
:root{
    --t-font-family-base: "Chinese Quotes", "Inter var", "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --t-home-hero-name-background: -webkit-linear-gradient(120deg,#e59866 5%, #922b21);
    --t-c-text-1: rgba(60, 60, 67);
    --t-c-text-2: rgba(60, 60, 67,.78);
    --t-c-text-3: rgba(60, 60, 67,.56);
    --t-c-main:#007bff;
	--t-c-border:#c2c2c4;
    --t-c-border-2:rgb(229,231,235);
	--t-c-bg:#f9fafb;
    --t-c-bg-2:rgb(255,255,255,.5);
	--t-c-bg-3:rgb(142,150,170,.14);
	--t-c-bg-4:#fff;
    --t-c-gutter:#e2e2e3;
    --bg-body: #f7f7fb;
	--color-body: #20232b;
    --bg-header: #fff;
    --bg-header-sticky: rgba(255, 255, 255, 0.8);
    --bg-sidebar: #f3f3f3;
    --bg-block: rgba(255,255,255,.5);
    --border-block: #e2e2e2;
    --color-secondary: #424a57;
    --bg-secondary: #fff;
    --bg-light: #ececec;
    --border-light: #f3f3f3;
    --color-muted: #999;
    --color-muted-hover: #20232B;
    --border-1: #d2d2d2;
    --color-1: #424a57;
    --bg-1: #20232b;
}
.dark{
    --t-c-bg: #111827;
    --t-c-text-1: rgba(255, 255, 245, .86);
    --t-c-text-2: rgba(235, 235, 245,.6);
    --t-c-text-3: rgba(235, 235, 245,.38);
    --t-c-divider: #2e2e32;
    --t-c-border:#3c3f44;
    --t-c-border-2:rgb(55,65,81);
	--t-c-bg-2:rgb(31,41,55,.5);
	--t-c-bg-3:rgb(101,117,133,.16);
	--t-c-bg-4:#22272e;
    --t-c-gutter:#000;
    --bg-body: #131313;
    --color-body: #ececec;
    --bg-header: #000;
    --bg-header-sticky: rgba(0, 0, 0, 0.6);
    --bg-sidebar: #131313;
    --bg-block: rgba(31,41,55,.5);
    --border-block: rgba(55,65,81);
    --color-secondary: #f3f3f4;
    --bg-secondary: #212121;
    --bg-light: #3e3e3e;
    --border-light: #3d3e3e;
    --color-muted: #c8c9cc;
    --color-muted-hover: #ececec;
    --border-1: #2c2c2c;
    --color-1: #a2a6b1;
    --bg-1: #3858f6;
}