F-light-en (English date format optimized)

Created Diff never expires
11 removals
Lines
Total
Removed
Words
Total
Removed
To continue using this feature, upgrade to
Diffchecker logo
Diffchecker Pro
1013 lines
27 additions
Lines
Total
Added
Words
Total
Added
To continue using this feature, upgrade to
Diffchecker logo
Diffchecker Pro
1031 lines
<?xml version="1.0" encoding="UTF-8" ?>
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<!DOCTYPE html>
<html b:css='false' b:defaultwidgetversion='2' b:js='true' b:layoutsVersion='3' b:responsive='true' expr:dir='data:blog.languageDirection' expr:lang='data:blog.locale' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'><b:attr name='xmlns' value=''/><b:attr name='xmlns:b' value=''/><b:attr name='xmlns:expr' value=''/><b:attr name='xmlns:data' value=''/>
<html b:css='false' b:defaultwidgetversion='2' b:js='true' b:layoutsVersion='3' b:responsive='true' expr:dir='data:blog.languageDirection' expr:lang='data:blog.locale' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'><b:attr name='xmlns' value=''/><b:attr name='xmlns:b' value=''/><b:attr name='xmlns:expr' value=''/><b:attr name='xmlns:data' value=''/>
<head>
<head>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0' name='viewport'/>
<meta content='width=device-width,initial-scale=1.0,minimum-scale=1.0' name='viewport'/>
<meta expr:content='&quot;text/html; charset=&quot; + data:blog.encoding' http-equiv='Content-Type'/>
<meta expr:content='&quot;text/html; charset=&quot; + data:blog.encoding' http-equiv='Content-Type'/>
<meta content='blogger' name='generator'/>
<meta content='blogger' name='generator'/>
<!-- DNS prefetch -->
<!-- DNS prefetch -->
<link href='//blogger.googleusercontent.com' rel='dns-prefetch'/>
<link href='//blogger.googleusercontent.com' rel='dns-prefetch'/>
<link href='//1.bp.blogspot.com' rel='dns-prefetch'/>
<link href='//1.bp.blogspot.com' rel='dns-prefetch'/>
<link href='//www.blogger.com' rel='dns-prefetch'/>
<link href='//www.blogger.com' rel='dns-prefetch'/>
<link href='//cdn.jsdelivr.net' rel='dns-prefetch'/>
<link href='//cdn.jsdelivr.net' rel='dns-prefetch'/>
<!-- SEO -->
<!-- SEO -->
<b:if cond='data:view.isSingleItem'>
<b:if cond='data:view.isSingleItem'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<title><data:blog.pageName/> | <data:blog.title/></title>
<meta expr:content='resizeImage(data:view.featuredImage, 560, &quot;16:9&quot;)' name='thumbnail'/>
<meta expr:content='resizeImage(data:view.featuredImage, 560, &quot;16:9&quot;)' name='thumbnail'/>
<b:elseif cond='data:view.search.query'/>
<b:elseif cond='data:view.search.query'/>
<title>Search Query of &quot;<data:view.search.query/>&quot; | <data:blog.title/></title>
<title>Search Query of &quot;<data:view.search.query/>&quot; | <data:blog.title/></title>
<b:elseif cond='data:view.isLabelSearch'/>
<b:elseif cond='data:view.isLabelSearch'/>
<title><data:blog.pageName/> | <data:blog.title/></title>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:elseif cond='data:view.archive.month'/>
<b:elseif cond='data:view.archive'/>
<title><data:view.archive.month/>/<data:view.archive.year/> | <data:blog.title/></title>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:elseif cond='data:view.archive.year'/>
<title><data:view.archive.year/> | <data:blog.title/></title>
<b:elseif cond='data:view.isError'/>
<b:elseif cond='data:view.isError'/>
<title>404 Not Found | <data:blog.title/></title>
<title>404 Not Found | <data:blog.title/></title>
<b:else/>
<b:else/>
<title><data:blog.pageTitle/></title>
<title><data:blog.pageTitle/></title>
</b:if>
</b:if>
<meta expr:content='data:view.description.escaped' name='description'/>
<meta expr:content='data:view.description.escaped' name='description'/>
<link expr:href='data:view.url.canonical' rel='canonical'/>
<link expr:href='data:view.url.canonical' rel='canonical'/>
<!-- Favicon -->
<!-- Favicon -->
<link expr:href='data:blog.blogspotFaviconUrl' rel='icon' type='image/x-icon'/>
<link expr:href='data:blog.blogspotFaviconUrl' rel='icon' type='image/x-icon'/>
<!-- RSS Feed -->
<!-- RSS Feed -->
<data:blog.feedLinks/>
<data:blog.feedLinks/>
<!-- OGP -->
<!-- OGP -->
<meta expr:content='data:blog.url.canonical' property='og:url'/>
<meta expr:content='data:blog.url.canonical' property='og:url'/>
<b:if cond='data:view.isSingleItem'>
<b:if cond='data:view.isSingleItem'>
<meta expr:content='data:blog.pageName.escaped + &quot; | &quot; + data:blog.title' property='og:title'/>
<meta expr:content='data:blog.pageName.escaped + &quot; | &quot; + data:blog.title' property='og:title'/>
<b:elseif cond='data:view.search.query'/>
<b:elseif cond='data:view.search.query'/>
<meta expr:content=' &quot;Search Query of &quot; + data:view.search.query + &quot; | &quot; + data:blog.title' property='og:title'/>
<meta expr:content=' &quot;Search Query of &quot; + data:view.search.query + &quot; | &quot; + data:blog.title' property='og:title'/>
<b:elseif cond='data:view.isLabelSearch'/>
<b:elseif cond='data:view.isLabelSearch'/>
<meta expr:content='&quot;Label: &quot; + data:blog.pageName.escaped + &quot; | &quot; + data:blog.title' property='og:title'/>
<meta expr:content='&quot;Label: &quot; + data:blog.pageName.escaped + &quot; | &quot; + data:blog.title' property='og:title'/>
<b:elseif cond='data:view.archive.month'/>
<b:elseif cond='data:view.archive'/>
<meta expr:content='data:view.archive.month + &quot;/&quot; + data:view.archive.year + &quot; | &quot; + data:blog.title' property='og:title'/>
<meta expr:content='data:blog.pageName.ascaped + &quot; | &quot; + data:blog.title' property='og:title'/>
<b:elseif cond='data:view.archive.year'/>
<meta expr:content='data:view.archive.year + &quot; | &quot; + data:blog.title' property='og:title'/>
<b:elseif cond='data:view.isError'/>
<b:elseif cond='data:view.isError'/>
<meta expr:content='&quot;404 Not Found&quot; + &quot; | &quot; + data:blog.title' property='og:title'/>
<meta expr:content='&quot;404 Not Found&quot; + &quot; | &quot; + data:blog.title' property='og:title'/>
<b:else/>
<b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.title' property='og:title'/>
</b:if>
</b:if>
<meta expr:content='data:view.description.escaped' property='og:description'/>
<meta expr:content='data:view.description.escaped' property='og:description'/>
<b:if cond='data:view.isSingleItem'>
<b:if cond='data:view.isSingleItem'>
<meta content='article' property='og:type'/>
<meta content='article' property='og:type'/>
<b:else/>
<b:else/>
<meta content='blog' property='og:type'/>
<meta content='blog' property='og:type'/>
</b:if>
</b:if>
<meta expr:content='data:blog.title' property='og:site_name'/>
<meta expr:content='data:blog.title' property='og:site_name'/>
<b:if cond='data:view.featuredImage'>
<b:if cond='data:view.featuredImage'>
<meta expr:content='resizeImage(data:view.featuredImage, 560, &quot;16:9&quot;)' property='og:image'/>
<meta expr:content='resizeImage(data:view.featuredImage, 560, &quot;16:9&quot;)' property='og:image'/>
<b:else/>
<b:else/>
<meta content='【OGP Image URL here】' property='og:image'/>
<meta content='【OGP Image URL here】' property='og:image'/>
</b:if>
</b:if>
<meta content='summary_large_image' name='twitter:card'/>
<meta content='summary_large_image' name='twitter:card'/>
<meta content='light' id='twth' name='twitter:widgets:theme'/>
<meta content='light' id='twth' name='twitter:widgets:theme'/>
<b:if cond='!data:view.isLayoutMode'>
<b:if cond='!data:view.isLayoutMode'>
<b:skin><![CDATA[
<b:skin><![CDATA[
/*--------------------------------------------------------------
/*--------------------------------------------------------------
Blogger Template
Blogger Template
Name : F-light
Name : F-light
Version : 1.35-TD-en
Version : 1.35-TD-en
Designer: Fujiyan
Designer: Fujiyan
Url : https://f-light-theme.blogspot.com/
Url : https://f-light-theme.blogspot.com/
License : Customization is available, but redistribution and sale are prohibited.
License : Customization is available, but redistribution and sale are prohibited.
----------------------------------------------------------------*/
----------------------------------------------------------------*/
/*==== Reset CSS ====*/
/*==== Reset CSS ====*/
html{min-height:100vh}.item-control{display:none}*{margin:0;padding:0;font-size:100%;vertical-align:baseline}*,::after,::before{box-sizing:border-box}html{font-size:62.5%}body{word-wrap:break-word;overflow-wrap:break-word}img{height:auto;max-width:100%;vertical-align:bottom}iframe{max-width:100%;border:none}.post-body ol,.post-body ul{padding-left:1em}.widget-content ul,.widget-content ol{padding-left:1.5em}@media(max-width:1024px){body{font-size:1.6rem}}
html{min-height:100vh}.item-control{display:none}*{margin:0;padding:0;font-size:100%;vertical-align:baseline}*,::after,::before{box-sizing:border-box}html{font-size:62.5%}body{word-wrap:break-word;overflow-wrap:break-word}img{height:auto;max-width:100%;vertical-align:bottom}iframe{max-width:100%;border:none}.post-body ol,.post-body ul{padding-left:1em}.widget-content ul,.widget-content ol{padding-left:1.5em}@media(max-width:1024px){body{font-size:1.6rem}}
/*<Group description="Brand Color">
/*<Group description="Brand Color">
<Variable name="brand" description="Deep Brand Color" type="color" default="#4169e1" value="#4169e1"/>
<Variable name="brand" description="Deep Brand Color" type="color" default="#4169e1" value="#4169e1"/>
<Variable name="brand.font" description="Text on Deep Brand Color" type="color" default="#ffffff" value="#ffffff"/>
<Variable name="brand.font" description="Text on Deep Brand Color" type="color" default="#ffffff" value="#ffffff"/>
<Variable name="brand.light" description="Pale Brand Color" type="color" default="#1e90ff" value="#1e90ff"/>
<Variable name="brand.light" description="Pale Brand Color" type="color" default="#1e90ff" value="#1e90ff"/>
<Variable name="brand.light.font" description="Text on Pale Brand Color" type="color" default="#ffffff" value="#ffffff"/>
<Variable name="brand.light.font" description="Text on Pale Brand Color" type="color" default="#ffffff" value="#ffffff"/>
<Variable name="sub.brand" description="Sub Brand Color" type="color" default="#ff6347" value="#ff6347"/>
<Variable name="sub.brand" description="Sub Brand Color" type="color" default="#ff6347" value="#ff6347"/>
<Variable name="sub.brand.font" description="Text on Sub Brand Color" type="color"
<Variable name="sub.brand.font" description="Text on Sub Brand Color" type="color"
default="#ffffff" value="#ffffff"/>
default="#ffffff" value="#ffffff"/>
</Group>
</Group>
<Group description="Background Color">
<Group description="Background Color">
<Variable name="darkmode.dark.bg" description="Deep Background Color in Dark Mode" type="color" default="#171e2d" value="#171e2d"/>
<Variable name="darkmode.dark.bg" description="Deep Background Color in Dark Mode" type="color" default="#171e2d" value="#171e2d"/>
<Variable name="darkmode.light.bg" description="Pale Background Color in Dark Mode" type="color" default="#1d2638" value="#1d2638"/>
<Variable name="darkmode.light.bg" description="Pale Background Color in Dark Mode" type="color" default="#1d2638" value="#1d2638"/>
<Variable name="lightmode.dark.bg" description="Deep Background Color in Light Mode" type="color" default="#eeeeff" value="#eeeeff"/>
<Variable name="lightmode.dark.bg" description="Deep Background Color in Light Mode" type="color" default="#eeeeff" value="#eeeeff"/>
<Variable name="lightmode.light.bg" description="Pale Background Color in Light Mode" type="color" default="#fbfbff" value="#fbfbff"/>
<Variable name="lightmode.light.bg" description="Pale Background Color in Light Mode" type="color" default="#fbfbff" value="#fbfbff"/>
<Variable name="darkmode.shadow" description="Shadow Color in Dark Mode" type="color" default="#000000" value="#000000"/>
<Variable name="darkmode.shadow" description="Shadow Color in Dark Mode" type="color" default="#000000" value="#000000"/>
<Variable name="lightmode.shadow" description="Shadow Color in Light Mode" type="color" default="#aaaaaa" value="#aaaaaa"/>
<Variable name="lightmode.shadow" description="Shadow Color in Light Mode" type="color" default="#aaaaaa" value="#aaaaaa"/>
</Group>
</Group>
<Group description="Text Color">
<Group description="Text Color">
<Variable name="darkmode.dark.font" description="Deep Text Color in Dark Mode" type="color" default="#eeeeee" value="#eeeeee"/>
<Variable name="darkmode.dark.font" description="Deep Text Color in Dark Mode" type="color" default="#eeeeee" value="#eeeeee"/>
<Variable name="darkmode.light.font" description="Pale Text Color in Dark Mode" type="color" default="#c0c0c0" value="#c0c0c0"/>
<Variable name="darkmode.light.font" description="Pale Text Color in Dark Mode" type="color" default="#c0c0c0" value="#c0c0c0"/>
<Variable name="lightmode.dark.font" description="Deep Text Color in Light Mode" type="color" default="#333333" value="#333333"/>
<Variable name="lightmode.dark.font" description="Deep Text Color in Light Mode" type="color" default="#333333" value="#333333"/>
<Variable name="lightmode.light.font" description="Pale Text Color in Light Mode" type="color" default="#666666" value="#666666"/>
<Variable name="lightmode.light.font" description="Pale Text Color in Light Mode" type="color" default="#666666" value="#666666"/>
<Variable name="darkmode.link" description="Link Color in Dark Mode" type="color" default="#00bfff" value="#00bfff"/>
<Variable name="darkmode.link" description="Link Color in Dark Mode" type="color" default="#00bfff" value="#00bfff"/>
<Variable name="lightmode.link" description="Link Color in Light Mode" type="color" default="#4169e1" value="#4169e1"/>
<Variable name="lightmode.link" description="Link Color in Light Mode" type="color" default="#4169e1" value="#4169e1"/>
</Group>*/
</Group>*/
/*==== Dark Mode ====*/
/*==== Dark Mode ====*/
:root {
:root {
--dark-bg: $(darkmode.dark.bg); /*Deep Background Color*/
--dark-bg: $(darkmode.dark.bg); /*Deep Background Color*/
--light-bg: $(darkmode.light.bg); /*Pale Background Color*/
--light-bg: $(darkmode.light.bg); /*Pale Background Color*/
--shadow: #000; /*Shadow*/
--shadow: #000; /*Shadow*/
--color: $(darkmode.dark.font); /*Deep Text Color*/
--color: $(darkmode.dark.font); /*Deep Text Color*/
--dark-color: $(darkmode.light.font); /*Pale Text Color*/
--dark-color: $(darkmode.light.font); /*Pale Text Color*/
--red-color: Tomato; /*Red Text*/
--red-color: Tomato; /*Red Text*/
--blue-color: #8cb4ff; /*Blue Text*/
--blue-color: #8cb4ff; /*Blue Text*/
--green-color: #00d061; /*Green Text*/
--green-color: #00d061; /*Green Text*/
--link: $(darkmode.link); /*Link Color*/
--link: $(darkmode.link); /*Link Color*/
--brand: $(brand); /*Deep Brand Color*/
--brand: $(brand); /*Deep Brand Color*/
--brand-light: $(brand.light); /*Pale Brand Color*/
--brand-light: $(brand.light); /*Pale Brand Color*/
--brand-font: $(brand.font); /*Text Color on Brand Color*/
--brand-font: $(brand.font); /*Text Color on Brand Color*/
--sub-brand: $(sub.brand); /*Sub Brand Color*/
--sub-brand: $(sub.brand); /*Sub Brand Color*/
--sub-brand-font: $(sub.brand.font) /*Text Color on Sub Brand Color*/
--sub-brand-font: $(sub.brand.font) /*Text Color on Sub Brand Color*/
}
}
/*==== Light Mode ====*/
/*==== Light Mode ====*/
:root[data-theme-mode="light"] {
:root[data-theme-mode="light"] {
--dark-bg: $(lightmode.dark.bg); /*Deep Background Color*/
--dark-bg: $(lightmode.dark.bg); /*Deep Background Color*/
--light-bg: $(lightmode.light.bg); /*Pale Background Color*/
--light-bg: $(lightmode.light.bg); /*Pale Background Color*/
--shadow: $(lightmode.shadow); /*Shadow*/
--shadow: $(lightmode.shadow); /*Shadow*/
--color: $(lightmode.dark.font); /*Deep Text Color*/
--color: $(lightmode.dark.font); /*Deep Text Color*/
--dark-color: $(lightmode.light.font); /*Pale Text Color*/
--dark-color: $(lightmode.light.font); /*Pale Text Color*/
--red-color: #d30038; /*Red Text*/
--red-color: #d30038; /*Red Text*/
--blue-color: #592bff; /*Blue Text*/;
--blue-color: #592bff; /*Blue Text*/;
--green-color: #007936; /*Green Text*/;
--green-color: #007936; /*Green Text*/;
--link: $(lightmode.link); /*Link Color*/
--link: $(lightmode.link); /*Link Color*/
}
}
]]></b:skin>
]]></b:skin>


<style>/*<![CDATA[*/
<style>/*<![CDATA[*/
/*==== Common ====*/
/*==== Common ====*/
body {
body {
font-size: 1.7rem;
font-size: 1.7rem;
font-family: sans-serif;
font-family: sans-serif;
color: var(--color);
color: var(--color);
background: var(--light-bg);
background: var(--light-bg);
text-underline-offset: .2em;
text-underline-offset: .2em;
text-decoration-skip-ink: none;
text-decoration-skip-ink: none;
-webkit-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
text-size-adjust: 100%;
text-size-adjust: 100%;
}
}
#sub-content a {
#sub-content a {
color: var(--link);
color: var(--link);
}
}
#sub-content .widget {
#sub-content .widget {
padding: .5em;
padding: .5em;
}
}
a {
a {
text-decoration: none;
text-decoration: none;
color: inherit;
color: inherit;
transition: .3s;
transition: .3s;
}
}
.blogger-clickTrap {
.blogger-clickTrap {
display: none;
display: none;
}
}
button:hover {
button:hover {
cursor: pointer;
cursor: pointer;
}
}
select {
select {
outline: none;
outline: none;
}
}
::selection {
::selection {
background: #00e5ff;
background: #00e5ff;
color: #000;
color: #000;
}
}
::-webkit-scrollbar {
::-webkit-scrollbar {
width: 6px;
width: 6px;
height: 6px;
height: 6px;
}
}
::-webkit-scrollbar-track {
::-webkit-scrollbar-track {
background: var(--light-bg);
background: var(--light-bg);
border-radius: 10px;
border-radius: 10px;
}
}
::-webkit-scrollbar-thumb {
::-webkit-scrollbar-thumb {
background: #aaa;
background: #aaa;
border-radius: 10px;
border-radius: 10px;
}
}
::-webkit-scrollbar-thumb:hover {
::-webkit-scrollbar-thumb:hover {
background: #bbb;
background: #bbb;
}
}
* {
* {
scrollbar-width: thin;
scrollbar-width: thin;
scrollbar-color: #aaa transparent;
scrollbar-color: #aaa transparent;
}
}
summary {
summary {
display: block;
display: block;
list-style: none;
list-style: none;
}
}
summary::-webkit-details-marker {
summary::-webkit-details-marker {
display: none;
display: none;
}
}
#MAIN .widget {
#MAIN .widget {
margin-bottom: 3em;
margin-bottom: 3em;
}
}
rt {
rt {
font-size: 50%;
font-size: 50%;
}
}


/*==== Header ====*/
/*==== Header ====*/
header {
header {
background: var(--light-bg);
background: var(--light-bg);
}
}
#header-title {
#header-title {
font-size: 2.5rem;
font-size: 2.5rem;
padding: .5em;
padding: .5em;
text-align: center;
text-align: center;
}
}
#header-title a {
#header-title a {
font-weight: bold;
font-weight: bold;
}
}
#header-title a:hover {
#header-title a:hover {
color: var(--link);
color: var(--link);
}
}
#header-desc {
#header-desc {
font-size: 1.2rem;
font-size: 1.2rem;
line-height: 1.3;
line-height: 1.3;
color: var(--dark-color);
color: var(--dark-color);
text-align: center;
text-align: center;
padding: 0 1em 1em;
padding: 0 1em 1em;
}
}
.header-img {
.header-img {
background-position: center;
background-position: center;
background-repeat: no-repeat;
background-repeat: no-repeat;
text-align: center;
text-align: center;
}
}


/*==== Mode Switch ====*/
/*==== Mode Switch ====*/
#mode-switch {
#mode-switch {
position: absolute;
position: absolute;
top: 5px;
top: 5px;
right: 1em;
right: 1em;
}
}
#mode-switch label {
#mode-switch label {
cursor: pointer;
cursor: pointer;
}
}
#mode-switch svg {
#mode-switch svg {
height: 24px;
height: 24px;
width: 24px;
width: 24px;
color: var(--brand-font);
color: var(--brand-font);
}
}
#switch-mode-dark svg {
#switch-mode-dark svg {
transform: scale(-1, 1);
transform: scale(-1, 1);
}
}
@media (max-width: 1024px) {
@media (max-width: 1024px) {
#mode-switch {
#mode-switch {
right: 45px;
right: 45px;
}
}
}
}
#switch-mode-dark {
#switch-mode-dark {
display: none;
display: none;
}
}
input[type="checkbox"]#js_mode_toggle {
input[type="checkbox"]#js_mode_toggle {
display: none;
display: none;
}
}
#js_mode_toggle:checked ~ label #switch-mode-dark {
#js_mode_toggle:checked ~ label #switch-mode-dark {
display: initial;
display: initial;
}
}
#js_mode_toggle:checked ~ label #switch-mode-light {
#js_mode_toggle:checked ~ label #switch-mode-light {
display: none;
display: none;
}
}
#nav-button:checked ~ #mode-switch {
#nav-button:checked ~ #mode-switch {
display: none;
display: none;
}
}


/*==== Nav Bar ====*/
/*==== Nav Bar ====*/
nav {
nav {
background: linear-gradient(to right, var(--brand-light), var(--brand), var(--brand-light));
background: linear-gradient(to right, var(--brand-light), var(--brand), var(--brand-light));
opacity: .9;
opacity: .9;
box-shadow: 0 3px 6px -4px var(--shadow);
box-shadow: 0 3px 6px -4px var(--shadow);
position: -webkit-sticky;
position: -webkit-sticky;
position: sticky;
position: sticky;
top: 0;
top: 0;
z-index: 10;
z-index: 10;
min-height: 2em;
min-height: 2em;
margin-top: -1px;
margin-top: -1px;
}
}
#nav {
#nav {
position: relative;
position: relative;
margin: auto;
margin: auto;
width: 100%;
width: 100%;
max-width: 1160px;
max-width: 1160px;
min-width: 960px;
min-width: 960px;
}
}
#nav-button,
#nav-button,
#nav-label {
#nav-label {
display: none;
display: none;
}
}
#nav-content ul {
#nav-content ul {
display: flex;
display: flex;
flex-wrap: wrap;
flex-wrap: wrap;
max-width: 640px;
max-width: 640px;
}
}
#nav-content li {
#nav-content li {
line-height: 1.5;
line-height: 1.5;
list-style: none;
list-style: none;
transition: .3s;
transition: .3s;
}
}
#nav-content li a {
#nav-content li a {
display: block;
display: block;
font-size: 1.4rem;
font-size: 1.4rem;
padding: .5em 10px;
padding: .5em 10px;
color: var(--brand-font);
color: var(--brand-font);
}
}
#nav-content li a:hover {
#nav-content li a:hover {
background: #eef;
background: #eef;
color: #333!important;
color: #333!important;
}
}
@media (max-width: 1024px ) {
@media (max-width: 1024px ) {
nav {
nav {
height: 2em;
height: 2em;
}
}
#nav {
#nav {
box-shadow: 0 3px 6px -4px var(--shadow);
box-shadow: 0 3px 6px -4px var(--shadow);
background: var(--light-bg);
background: var(--light-bg);
padding-left: 8px;
padding-left: 8px;
min-width: 0;
min-width: 0;
}
}
#nav-content {
#nav-content {
max-height: 0;
max-height: 0;
overflow: hidden;
overflow: hidden;
transition: .2s;
transition: .2s;
}
}
input[type="checkbox"]#nav-button {
input[type="checkbox"]#nav-button {
display: none;
display: none;
}
}
#nav-button:checked ~ #nav-content {
#nav-button:checked ~ #nav-content {
max-height: 500px;
max-height: 500px;
transition: 1s;
transition: 1s;
}
}
#nav-content ul {
#nav-content ul {
margin-top: 30px;
margin-top: 30px;
max-width: 100%;
max-width: 100%;
}
}
#nav-content li {
#nav-content li {
width: 200px;
width: 200px;
margin-bottom: 5px;
margin-bottom: 5px;
margin-right: 8px;
margin-right: 8px;
}
}
#nav-content li a {
#nav-content li a {
width: 100%;
width: 100%;
display: block;
display: block;
color: var(--brand-font);
color: var(--brand-font);
text-align: center;
text-align: center;
background: var(--brand);
background: var(--brand);
border-radius: 3px;
border-radius: 3px;
}
}
#nav-label {
#nav-label {
float: right;
float: right;
position: relative;
position: relative;
display: flex;
display: flex;
height: 30px;
height: 30px;
width: 30px;
width: 30px;
align-items: center;
align-items: center;
margin-left: 5px;
margin-left: 5px;
cursor: pointer;
cursor: pointer;
z-index: 1;
z-index: 1;
}
}
#nav-label span,
#nav-label span,
#nav-label span::before,
#nav-label span::before,
#nav-label span::after {
#nav-label span::after {
position: absolute;
position: absolute;
content: "";
content: "";
display: block;
display: block;
height: 2px;
height: 2px;
width: 24px;
width: 24px;
border-radius: 2px;
border-radius: 2px;
background: var(--brand-font);
background: var(--brand-font);
transition: .3s;
transition: .3s;
}
}
#nav-label span::before {
#nav-label span::before {
bottom: 8px;
bottom: 8px;
}
}
#nav-label span::after {
#nav-label span::after {
top: 8px;
top: 8px;
}
}
#nav-button:checked ~ #nav-label span {
#nav-button:checked ~ #nav-label span {
background: transparent;
background: transparent;
}
}
#nav-button:checked ~ #nav-label span::before {
#nav-button:checked ~ #nav-label span::before {
bottom: 0;
bottom: 0;
transform: rotate(45deg);
transform: rotate(45deg);
background: var(--color);
background: var(--color);
}
}
#nav-button:checked ~ #nav-label span::after {
#nav-button:checked ~ #nav-label span::after {
top: 0;
top: 0;
transform: rotate(-45deg);
transform: rotate(-45deg);
background: var(--color);
background: var(--color);
}
}
}
}
#mobile-home {
#mobile-home {
display: none;
display: none;
color: var(--brand-font);
color: var(--brand-font);
position: absolute;
position: absolute;
font-size: 2.2rem;
font-size: 2.2rem;
top: 3px;
top: 3px;
}
}
#mobile-jump {
#mobile-jump {
display: none;
display: none;
color: var(--brand-font);
color: var(--brand-font);
position: absolute;
position: absolute;
}
}
#mobile-jump span {
#mobile-jump span {
display: inline-block;
display: inline-block;
margin: 0 5px;
margin: 0 5px;
height: 34px;
height: 34px;
cursor: pointer;
cursor: pointer;
}
}
#mobile-jump svg {
#mobile-jump svg {
margin-top: 5px;
margin-top: 5px;
}
}
#nav-button:checked ~ #mobile-home,
#nav-button:checked ~ #mobile-home,
#nav-button:checked ~ #mobile-jump,#nav-button:checked ~ .item-control a:not(.comment-delete) {
#nav-button:checked ~ #mobile-jump,#nav-button:checked ~ .item-control a:not(.comment-delete) {
display: none;
display: none;
}
}
@media (max-width: 1024px) {
@media (max-width: 1024px) {
#mobile-home,
#mobile-home,
#mobile-jump {
#mobile-jump {
display: initial;
display: initial;
}
}
}
}


/*==== Search Box ====*/
/*==== Search Box ====*/
#search-wrap {
#search-wrap {
position: absolute;
position: absolute;
right: 0;
right: 0;
}
}
.search-box-form {
.search-box-form {
position: relative;
position: relative;
width: 300px;
width: 300px;
margin-right: 90px;
margin-right: 90px;
background: transparent;
background: transparent;
z-index: 2;
z-index: 2;
}
}
.search-box-text {
.search-box-text {
width: 100%;
width: 100%;
height: 1.9em;
height: 1.9em;
margin-top: 2px;
margin-top: 2px;
border: 2px solid transparent;
border: 2px solid transparent;
border-radius: 5px;
border-radius: 5px;
outline: none;
outline: none;
background: transparent;
background: transparent;
color: var(--brand-font);
color: var(--brand-font);
font-size: 1.6rem;
font-size: 1.6rem;
padding: 2px 5px 0 28px;
padding: 2px 5px 0 28px;
transition: .2s;
transition: .2s;
}
}
.search-box-text:hover,
.search-box-text:hover,
.search-box-text:focus {
.search-box-text:focus {
border-color: var(--brand-font);
border-color: var(--brand-font);
}
}
.search-box-text:focus {
.search-box-text:focus {
background: var(--brand);
background: var(--brand);
}
}
.search-box-text::placeholder {
.search-box-text::placeholder {
color: var(--brand-font);
color: var(--brand-font);
}
}
.search-box-submit {
.search-box-submit {
color: var(--brand-font);
color: var(--brand-font);
position: absolute;
position: absolute;
left: 2px;
left: 2px;
top: 6px;
top: 6px;
border: none;
border: none;
background: transparent;
background: transparent;
outline: 0;
outline: 0;
padding: 0;
padding: 0;
transition: .3s;
transition: .3s;
}
}
.search-box-submit svg {
.search-box-submit svg {
height: 1.3em;
height: 1.3em;
width: 1.3em;
width: 1.3em;
}
}
.search-box-submit:hover {
.search-box-submit:hover {
transform: scale(1.2);
transform: scale(1.2);
}
}
::-webkit-search-cancel-button {
::-webkit-search-cancel-button {
height: 1.1em;
height: 1.1em;
width: 1.1em;
width: 1.1em;
-webkit-appearance: none;
-webkit-appearance: none;
cursor: pointer;
cursor: pointer;
background-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" fill="%23fff"/></svg>');
background-image: url('data:image/svg+xml;utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" fill="%23fff"/></svg>');
}
}
input[type="search"]::-webkit-search-decoration {
input[type="search"]::-webkit-search-decoration {
display: none;
display: none;
}
}
@media (max-width: 600px ) {
@media (max-width: 600px ) {
#search-wrap {
#search-wrap {
right: 30px;
right: 30px;
}
}
.search-box-form {
.search-box-form {
width: 150px;
width: 150px;
margin-left: 5px;
margin-left: 5px;
margin-right: 55px;
margin-right: 55px;
}
}
.search-box-text:focus {
.search-box-text:focus {
width: 230px;
width: 230px;
}
}
}
}
#nav-button:checked ~ #search-wrap {
#nav-button:checked ~ #search-wrap {
display: none;
display: none;
}
}
.search-box-text::-moz-placeholder {
.search-box-text::-moz-placeholder {
opacity: 1;
opacity: 1;
color: var(--brand-font);
color: var(--brand-font);
}
}


/*==== Archive Widget ====*/
/*==== Archive Widget ====*/
.archive-list {
.archive-list {
margin: 0 auto 1em;
margin: 0 auto 1em;
max-width: 500px;
max-width: 500px;
}
}
.archive-list ul {
.archive-list ul {
box-shadow: 2px 2px 6px var(--shadow);
box-shadow: 2px 2px 6px var(--shadow);
border-top: none;
border-top: none;
border-bottom-left-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-right-radius: 5px;
color: var(--color);
color: var(--color);
max-height: 16em;
max-height: 16em;
overflow: auto;
overflow: auto;
margin: 0 1px 0!important;
margin: 0 1px 0!important;
padding-left: 0!important;
padding-left: 0!important;
}
}
.archive-list ul li {
.archive-list ul li {
font-size: 1.5rem;
font-size: 1.5rem;
line-height: 1.8;
line-height: 1.8;
margin: 0!important;
margin: 0!important;
padding: 0!important;
padding: 0!important;
list-style: none;
list-style: none;
}
}
.archive-list summary {
.archive-list summary {
position: relative;
position: relative;
padding: 5px 0 5px 8px;
padding: 5px 0 5px 8px;
height: 2em;
height: 2em;
line-height: 1.5;
line-height: 1.5;
background: var(--brand);
background: var(--brand);
color: var(--brand-font);
color: var(--brand-font);
font-size: 1.5rem;
font-size: 1.5rem;
border-radius: 5px;
border-radius: 5px;
transition: .3s;
transition: .3s;
}
}
.archive-list summary:hover,
.archive-list summary:hover,
details[open].archive-list summary:hover {
details[open].archive-list summary:hover {
background: var(--brand-light);
background: var(--brand-light);
cursor: pointer;
cursor: pointer;
}
}
.archive-list a {
.archive-list a {
display: block;
display: block;
padding-left: .5em;
padding-left: .5em;
color: var(--color)!important;
color: var(--color)!important;
text-decoration: none!important;
text-decoration: none!important;
}
}
.archive-list a:hover {
.archive-list a:hover {
background: dodgerblue;
background: dodgerblue;
color: #fff!important;
color: #fff!important;
}
}
.archive-list .svg-icon-24 {
.archive-list .svg-icon-24 {
position: absolute;
position: absolute;
right: 3px;
right: 3px;
top: 0;
top: 0;
font-size: 2.5rem;
font-size: 2.5rem;
color: var(--darkfcolor);
color: var(--darkfcolor);
transition: .2s;
transition: .2s;
}
}
details[open].archive-list .svg-icon-24 {
details[open].archive-list .svg-icon-24 {
transform: rotate(180deg);
transform: rotate(180deg);
}
}
details[open].archive-list summary {
details[open].archive-list summary {
color: var(--brand-font);
color: var(--brand-font);
background: var(--brand-light);
background: var(--brand-light);
box-shadow: 0 4px 4px -4px var(--shadow);
box-shadow: 0 4px 4px -4px var(--shadow);
border-bottom-left-radius: 0;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
border-bottom-right-radius: 0;
}
}
.archive-list ul::-webkit-scrollbar-track {
.archive-list ul::-webkit-scrollbar-track {
background: var(--light-bg);
background: var(--light-bg);
}
}


/*==== Page List / Link List ====*/
/*==== Page List / Link List ====*/
.list-widget li {
.list-widget li {
list-style-type: none;
list-style-type: none;
line-height: 1.5;
line-height: 1.5;
padding-bottom: 5px;
padding-bottom: 5px;
}
}
.list-widget a {
.list-widget a {
color: var(--color)!important;
color: var(--color)!important;
font-size: 1.3rem;
font-size: 1.3rem;
font-weight: bold;
font-weight: bold;
padding: 5px 8px 3px;
padding: 5px 8px 3px;
text-indent: -5px;
text-indent: -5px;
border-radius: 2px;
border-radius: 2px;
width: 100%;
width: 100%;
display: block;
display: block;
}
}
.list-widget a::after {
.list-widget a::after {
content: "\00BB";
content: "\00BB";
margin-left: 2px;
margin-left: 2px;
}
}
.list-widget a:hover {
.list-widget a:hover {
background: var(--brand);
background: var(--brand);
color: var(--brand-font)!important;
color: var(--brand-font)!important;
}
}
.list-widget li a::before {
.list-widget li a::before {
content: "\25cf";
content: "\25cf";
padding-right: 2px;
padding-right: 2px;
color: var(--brand);
color: var(--brand);
}
}
.list-widget li a:hover::before {
.list-widget li a:hover::before {
color: var(--brand-font);
color: var(--brand-font);
}
}
.current-page {
.current-page {
font-size: 1.3rem;
font-size: 1.3rem;
padding: 5px 8px 3px;
padding: 5px 8px 3px;
text-indent: -5px;
text-indent: -5px;
display: block;
display: block;
}
}
.current-page::before {
.current-page::before {
content: "\25cf";
content: "\25cf";
padding-right: 2px;
padding-right: 2px;
}
}


/*==== Label Widget ====*/
/*==== Label Widget ====*/
.category-label {
.category-label {
display: inline-block;
display: inline-block;
border-radius: 5px;
border-radius: 5px;
margin-bottom: .5em;
margin-bottom: .5em;
background: var(--brand);
background: var(--brand);
color: var(--brand-font)!important;
color: var(--brand-font)!important;
transition: .3s;
transition: .3s;
line-height: 1;
line-height: 1;
padding: 6px;
padding: 6px;
font-size: 1.2rem;
font-size: 1.2rem;
}
}
.category-label:hover {
.category-label:hover {
background: var(--brand-light);
background: var(--brand-light);
}
}
.hashtag-label {
.hashtag-label {
display: inline-block;
display: inline-block;
margin-bottom: .5em;
margin-bottom: .5em;
color: var(--color)!important;
color: var(--color)!important;
border: solid var(--dark-color) 1px;
border: solid var(--dark-color) 1px;
border-radius: 3px;
border-radius: 3px;
line-height: 1;
line-height: 1;
transition: .2s;
transition: .2s;
font-size: 1.4rem;
font-size: 1.4rem;
padding: 4px 5px 3px;
padding: 4px 5px 3px;
}
}
.list-label-widget-content {
.list-label-widget-content {
text-align: center;
text-align: center;
}
}
.hashtag-label:hover {
.hashtag-label:hover {
border-color: var(--sub-brand);
border-color: var(--sub-brand);
background: var(--sub-brand);
background: var(--sub-brand);
color: var(--sub-brand-font)!important;
color: var(--sub-brand-font)!important;
}
}
.label-count {
.label-count {
font-size: 1.1rem;
font-size: 1.1rem;
margin-left: 3px;
margin-left: 3px;
}
}
.cloud-label-widget-content {
.cloud-label-widget-content {
text-align: center;
text-align: center;
}
}


/*== Profile Widget ==*/
/*== Profile Widget ==*/
.Profile {
.Profile {
min-height: 140px;
min-height: 140px;
text-align: center;
text-align: center;
}
}
.g-profile {
.g-profile {
font-size: 1.9rem;
font-size: 1.9rem;
line-height: 1.5;
line-height: 1.5;
}
}
.location {
.location {
font-size: 1.5rem;
font-size: 1.5rem;
}
}
.profile-info a {
.profile-info a {
font-weight: bold;
font-weight: bold;
color: var(--color)!important;
color: var(--color)!important;
}
}
.profile-info a:hover {
.profile-info a:hover {
color: var(--link)!important;
color: var(--link)!important;
text-decoration: underline;
text-decoration: underline;
}
}
.profile-textblock {
.profile-textblock {
font-size: 1.3rem;
font-size: 1.3rem;
line-height: 1.3;
line-height: 1.3;
margin-top: .5em;
margin-top: .5em;
margin-bottom: .5em;
margin-bottom: .5em;
color: var(--dark-color);
color: var(--dark-color);
}
}
.profile-textblock a {
.profile-textblock a {
color: var(--link)!important;
color: var(--link)!important;
}
}
.profile-textblock a:hover {
.profile-textblock a:hover {
text-decoration: underline;
text-decoration: underline;
color: var(--dark-color)!important;
color: var(--dark-color)!important;
}
}
.profile-img {
.profile-img {
width: 90px;
width: 90px;
height: 90px;
height: 90px;
object-fit: contain;
object-fit: contain;
border-radius: 50%;
border-radius: 50%;
transition: .3s;
transition: .3s;
margin-bottom: .5em;
margin-bottom: .5em;
}
}
.profile-img:hover {
.profile-img:hover {
opacity: .8;
opacity: .8;
}
}
.profile-info>.profile-link {
.profile-info>.profile-link {
font-size: 1.6rem;
font-size: 1.6rem;
}
}
.profile-info>.profile-link::after {
.profile-info>.profile-link::after {
content: "\00BB";
content: "\00BB";
}
}
.default-avatar {
.default-avatar {
display: inline-block;
display: inline-block;
margin-bottom: .5em;
margin-bottom: .5em;
}
}
.avatar-icon {
.avatar-icon {
font-size: 70px;
font-size: 70px;
color: var(--dark-color);
color: var(--dark-color);
border: 1px solid var(--dark-color);
border: 1px solid var(--dark-color);
border-radius: 50%;
border-radius: 50%;
}
}


/* Team Profile */
/* Team Profile */
.Profile li {
.Profile li {
margin: 1em;
margin: 1em;
padding-bottom: 1em;
padding-bottom: 1em;
list-style: none;
list-style: none;
}
}
.Profile li {
.Profile li {
border-bottom: dotted var(--dark-color) 2px;
border-bottom: dotted var(--dark-color) 2px;
}
}
.Profile li:last-child {
.Profile li:last-child {
border: none;
border: none;
}
}
.profile-name {
.profile-name {
font-size: 1.9rem;
font-size: 1.9rem;
line-height: 1.5;
line-height: 1.5;
}
}
a .profile-name {
a .profile-name {
font-weight: bold;
font-weight: bold;
color: var(--color) !important;
color: var(--color) !important;
}
}
a .profile-name:hover {
a .profile-name:hover {
color: var(--link) !important;
color: var(--link) !important;
text-decoration: underline;
text-decoration: underline;
}
}
a.profile-link:nth-of-type(2) {
a.profile-link:nth-of-type(2) {
font-size: 1.6rem;
font-size: 1.6rem;
font-weight: bold;
font-weight: bold;
color: var(--color) !important;
color: var(--color) !important;
}
}
a.profile-link:nth-of-type(2):hover {
a.profile-link:nth-of-type(2):hover {
color: var(--link) !important;
color: var(--link) !important;
text-decoration: underline!important;
text-decoration: underline!important;
}
}
.profile-link:nth-of-type(2)::after {
.profile-link:nth-of-type(2)::after {
content: "\00BB";
content: "\00BB";
}
}


/*==== Search Widget ====*/
/*==== Search Widget ====*/
.widget-content form {
.widget-content form {
position: relative;
position: relative;
max-width: 600px;
max-width: 600px;
margin: 0 auto;
margin: 0 auto;
}
}
.search-input input {
.search-input input {
box-sizing: border-box;
box-sizing: border-box;
background: var(--dark-bg);
background: var(--dark-bg);
color: var(--color);
color: var(--color);
border-top-left-radius: 5px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
border-bottom-left-radius: 5px;
border: none;
border: none;
width: calc(100% - 70px);
width: calc(100% - 70px);
height: 40px;
height: 40px;
padding: 0 .5em;
padding: 0 .5em;
}
}
.search-input input:focus {
.search-input input:focus {
outline: none;
outline: none;
border: 1px solid var(--brand);
border: 1px solid var(--brand);
padding: 0 calc(.5em - 1px);
padding: 0 calc(.5em - 1px);
}
}
.search-input input::placeholder {
.search-input input::placeholder {
color: var(--dark-color);
color: var(--dark-color);
}
}
.search-action {
.search-action {
position: absolute;
position: absolute;
background: var(--brand);
background: var(--brand);
color: var(--brand-font);
color: var(--brand-font);
border: none;
border: none;
border-top-right-radius: 5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border-bottom-right-radius: 5px;
top: 0;
top: 0;
right: 0;
right: 0;
width: 70px;
width: 70px;
height: 40px;
height: 40px;
}
}
.search-action:hover {
.search-action:hover {
cursor: pointer;
cursor: pointer;
opacity: .8;
opacity: .8;
}
}


/*==== Contact Form Widget ====*/
/*==== Contact Form Widget ====*/
.contact-form-email,
.contact-form-email,
.contact-form-email-message,
.contact-form-email-message,
.contact-form-name {
.contact-form-name {
max-width:100%;
max-width:100%;
min-width:100%;
min-width:100%;
color: var(--color);
color: var(--color);
padding: .5em;
padding: .5em;
outline: none;
outline: none;
border-radius: 3px;
border-radius: 3px;
background: var(--dark-bg);
background: var(--dark-bg);
transition: .2s;
transition: .2s;
border: 1px solid transparent;
border: 1px solid transparent;
}
}
.contact-form-email:focus,
.contact-form-email:focus,
.contact-form-email-message:focus,
.contact-form-email-message:focus,
.contact-form-name:focus {
.contact-form-name:focus {
box-shadow: 0 0 6px var(--link);
box-shadow: 0 0 6px var(--link);
border: 1px solid var(--link);
border: 1px solid var(--link);
}
}
.contact-form-email-message {
.contact-form-email-message {
min-height: 200px;
min-height: 200px;
}
}
.contact-form-email,
.contact-form-email,
.contact-form-name {
.contact-form-name {
height:40px;
height:40px;
}
}
.contact-form-button-submit {
.contact-form-button-submit {
border-radius : 3px;
border-radius : 3px;
line-height: .1;
line-height: .1;
margin: 2em 0;
margin: 2em 0;
cursor: pointer;
cursor: pointer;
padding: 1em 2em;
padding: 1em 2em;
background: var(--brand);
background: var(--brand);
color: var(--brand-font);
color: var(--brand-font);
transition: .3s;
transition: .3s;
border: none;
border: none;
outline: none;
outline: none;
}
}
.contact-form-button-submit:hover {
.contact-form-button-submit:hover {
transform: scale(1.1);
transform: scale(1.1);
}
}
.contact-form-button-submit:active {
.contact-form-button-submit:active {
transform: none;
transform: none;
}
}
.contact-form-error-message-with-border,
.contact-form-error-message-with-border,
.contact-form-success-message-with-border {
.contact-form-success-message-with-border {
color: var(--color);
color: var(--color);
font-weight: bold!important;
font-weight: bold!important;
}
}
.contact-form-cross {
.contact-form-cross {
width: .9em;
width: .9em;
height: .9em;
height: .9em;
vertical-align: -5%;
vertical-align: -5%;
margin:0 5px;
margin:0 5px;
}
}
.contact-form-cross:hover {
.contact-form-cross:hover {
cursor:pointer;
cursor:pointer;
}
}


/*==== Footer ====*/
/*==== Footer ====*/
#FOOTER .widget:not(#HTML0) {
#FOOTER .widget:not(#HTML0) {
margin: 0 .5em 2em;
margin: 0 .5em 2em;
}
}
#footer-attribution {
#footer-attribution {
background: var(--dark-bg);
background: var(--dark-bg);
color: var(--color);
color: var(--color);
font-size: 1.5rem;
font-size: 1.5rem;
padding: .5em;
padding: .5em;
display: flex;
display: flex;
justify-content: center;
justify-content: center;
}
}
#footer-attribution a {
#footer-attribution a {
font-weight: normal;
font-weight: normal;
}
}
#footer-attribution a:hover {
#footer-attribution a:hover {
color: var(--link);
color: var(--link);
text-decoration: underline;
text-decoration: underline;
}
}
#footer-attribution span:not(#presentyear)::after {
#footer-attribution span:not(#presentyear)::after {
content: "\FF5C";
content: "\FF5C";
margin-right: 3px;
margin-right: 3px;
}
}
#footer-attribution span:last-child::after {
#footer-attribution span:last-child::after {
display: none;
display: none;
}
}
@media (max-width: 950px ) {
@media (max-width: 950px ) {
#footer-attribution {
#footer-attribution {
align-items: center;
align-items: center;
flex-direction: column;
flex-direction: column;
}
}
#footer-attribution span::after {
#footer-attribution span::after {
display: none;
display: none;
}
}
}
}


/*==== SVG ====*/
/*==== SVG ====*/
.linesvg {
.linesvg {
height: 28px;
height: 28px;
width: 28px;
width: 28px;
padding-bottom: 3px;
padding-bottom: 3px;
margin-left: 2px;
margin-left: 2px;
}
}
.verified {
.verified {
height: 16px;
height: 16px;
width: 16px;
width: 16px;
vertical-align: -5%;
vertical-align: -5%;
margin-left: 3px;
margin-left: 3px;
}
}
.moon.svg {
.moon.svg {
transform: scale(-1, 1);
transform: scale(-1, 1);
}
}
.svg-icon-24 {
.svg-icon-24 {
fill: currentColor;
fill: currentColor;
height: 1.2em;
height: 1.2em;
width: 1.2em;
width: 1.2em;
vertical-align: -15%;
vertical-align: -15%;
}
}


/*==== Font Awesome ====*/
/*==== Font Awesome ====*/
.svg {
.svg {
fill: currentColor;
fill: currentColor;
height: 1em;
height: 1em;
width: 1em;
width: 1em;
margin-left: 2px;
margin-left: 2px;
margin-right: 2px;
margin-right: 2px;
vertical-align: -8%;
vertical-align: -8%;
}
}


/*==== Widget Title ====*/
/*==== Widget Title ====*/
.title {
.title {
background: linear-gradient(to right, var(--brand-light), var(--brand), var(--brand-light));
background: linear-gradient(to right, var(--brand-light), var(--brand), var(--brand-light));
font-size: 1.8rem;
font-size: 1.8rem;
font-weight: bold;
font-weight: bold;
line-height: 1.2;
line-height: 1.2;
margin-bottom: .5em;
margin-bottom: .5em;
padding: 3px;
padding: 3px;
color: var(--brand-font);
color: var(--brand-font);
border-radius: 3px;
border-radius: 3px;
text-align: center;
text-align: center;
}
}


/*==== Popular Posts ====*/
/*==== Popular Posts ====*/
.PopularPosts .article {
.PopularPosts .article {
height: 90px;
height: 90px;
position: relative;
position: relative;
margin-bottom: 20px;
margin-bottom: 20px;
transition: .3s;
transition: .3s;
border-radius: 5px;
border-radius: 5px;
box-shadow: 1px 1px 2px var(--shadow);
box-shadow: 1px 1px 2px var(--shadow);
}
}
.article > a {
.article > a {
position: absolute;
position: absolute;
top: 0;
top: 0;
left: 0;
left: 0;
width: 100%;
width: 100%;
height: 100%;
height: 100%;
}
}
.article:hover {
.article:hover {
box-shadow: 8px 8px 10px var(--shadow);
box-shadow: 8px 8px 10px var(--shadow);
}
}
.article-header {
.article-header {
color: var(--dark-color);
color: var(--dark-color);
font-size: 1.4rem;
font-size: 1.4rem;
line-height: 1.5;
line-height: 1.5;
bottom: 0;
bottom: 0;
right: 5px;
right: 5px;
position: absolute;
position: absolute;
margin-top: 5px;
margin-top: 5px;
}
}
.PopularPosts ul {
.PopularPosts ul {
max-width: 600px;
max-width: 600px;
margin-right: auto;
margin-right: auto;
margin-left: auto;
margin-left: auto;
}
}
.pop-img img {
.pop-img img {
position: absolute;
position: absolute;
object-fit: cover;
object-fit: cover;
width: 40%;
width: 40%;
height: 100%;
height: 100%;
border-radius: 5px 0 0 5px;
border-radius: 5px 0 0 5px;
}
}
.pop-title {
.pop-title {
display: flex;
display: flex;
font-weight: normal;
font-weight: normal;
margin-bottom: 5px;
margin-bottom: 5px;
overflow: hidden;
overflow: hidden;
line-height: 1.4;
line-height: 1.4;
position: relative;
position: relative;
font-size: 1.6rem;
font-size: 1.6rem;
height: 4.4em;
height: 4.4em;
left: 41%;
left: 41%;
width: 54%;
width: 54%;
}
}