* {
margin:	0;
padding: 0;
}

::selection {
color: #fff;
background: #2F4A60;
}

a {
color: #2F4A60;
display: inline-block;
}

a:hover,
a:focus,
a:active {
color: #2b6ecf;
}

html,
body {
background:	#f3f2f1;
color: #101010;
text-align:	center;
}

body {
font: 1rem sans-serif;
font-family: 'Inter', sans-serif;
font-optical-sizing: auto;
padding: 2%;
position: relative;
line-height: 130%;
}

#win {
text-align: left;
margin: 0 auto;
max-width: 1400px;
background:	#fff;
box-shadow: 2rem 2rem 3rem #dfdfde;
position: relative;
}

header,
footer {
padding: 1.5rem 2rem;
background:	#18324e;
position: relative;
}

footer {
margin-bottom: 1.5rem;
}

footer em {
padding-top: 0.5rem;
display: inline-block;
}

header {
position: sticky;
left: 0;
top: 0;
z-index: 2;
}

header div,
footer div {
position: relative;
}

header h1 {
font-size: 1rem;
padding: 0;
}

header h1 img {
max-width: 200px;
filter: invert(1) brightness(2);
}

header img {
user-select: none;
}

header #hamburger {
position: absolute;
top: -0.15rem;
right: 0;
z-index: 3;
}

#toggle,
#toggle:hover,
#toggle:focus,
#toggle:active {
text-decoration: none;
}

#toggle {
border-radius: 0.1rem;
padding: 0.35rem 0.45rem;
font-size: 1.3rem;
color: #18324e;
background: #fff;
}

header nav {
font-size: 0.9rem;
text-transform: uppercase;
letter-spacing: -0.1px;
}

#home {
background:	#164e6c url('image/91.jpg') no-repeat 50% 10%;
background-size: cover;
box-shadow:	inset 0 0 4rem #164e6c;
max-width: 100%;
padding: 15rem 4rem 7rem 4rem;
color: #fff;
}

#home h2 {
font-size: 2em;
}

#home p {
font-size: 1.35rem;
}

#home span {
backdrop-filter: blur(1rem);
}

#home h2,
#home p {
max-width: 740px;
font-weight: 500;
line-height: 1.5;
text-shadow: 0 0 0.5rem #103756;
}

#main {
position: relative;
padding: 2rem 3.5rem 3rem 3.5rem;
min-height:	75vh;
border-radius: 0.1rem;
}

main,
aside {
vertical-align: top;
display: inline-block;
}

main {
width: 80%;
max-width: calc(950px - 4rem);
}

main footer {
position: relative;
padding-left: 0;
padding-right: 0;
margin-top: 0.5rem;
margin-bottom: 0;
background:	#fff;
text-align: center;
}

aside {
float: right;
max-width: calc(80% - 4rem);
max-width: 300px;
padding: 2rem;
}

#popular,
#latest {
padding: 2rem 2rem 0 2rem;
line-height: 100%;
font-size: 0.95rem;
border-radius: 0.1rem;
}

#popular,
#latest,
#latest table,
#latest th,
#latest td {
background:	#e5ecf4;
}

#popular ol,
#latest table {
list-style: none;
padding: 0;
counter-reset: latest;
}

#latest tr:last-of-type th {
padding-bottom: 0;
}

#latest a {
line-height: 100%;
}

#popular li,
#latest th {
padding-bottom: 2rem;
}

#popular li {
position: relative;
padding-left: 3.25rem;
}

#popular li::before {
counter-increment: latest;
content: counter(latest);
display: inline-block;
position: absolute;
left: 0;
background: #6c7a89;
color: #fff;
padding: 0.25rem 0.5rem;
border-radius: 100%;
font-weight: 500;
min-width: 8px;
text-align: center;
}

#latest td:nth-of-type(odd) {
width: 3rem;
padding-right: 0;
padding-left: 0;
}

#latest td:nth-of-type(even) {
font-weight: 600;
padding-bottom: 0.5rem;
}

#popular strong {
font-weight: 600;
padding-bottom: 0.5rem;
display: inline-block;
}

#popular a,
#latest a {
text-decoration: none;
display: inline-block;
}

#popular a:hover,
#popular a:focus,
#popular a:active,
#latest a:hover,
#latest a:focus,
#latest a:active {

}

article footer {
background:	#fff;
padding: 0;
margin: 0;
}

button,
input[type='button'],
input[type='submit'],
input[type='date'],
input[type='file'],
input[type='checkbox'],
input[type='radio'],
label,
select {
cursor:	pointer;
}

input[disabled] {
cursor:	not-allowed;
}

input[type='checkbox'] {
vertical-align: baseline;
}

textarea {
min-width: 100px;
min-height: 100px;
max-width: 400px;
width: calc(100% - 1rem);
}

input[type='text'],
input[type='search'],
input[type='url'],
input[type='email'],
input[type='file'],
input[type='number'],
textarea,
select {
padding: 0.5rem;
}

button,
label,
textarea,
select,
input {
font: 1rem sans-serif;
}

fieldset {
display: inline-block;
border:	1px solid #000;
}

label {
padding-right: 0.5rem;
}

input[type='submit'],
input[type='button'],
button {
padding: 0.5rem 1rem;
}

a img,
img,
iframe {
border:	0;
text-decoration: none;
width: auto;
height: auto;
max-width: 100%;
}

#e {
padding: 0;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
text-align: center;
}

#e a {
padding: 0.5rem 1.5rem;
background: #fff;
}

article,
section {
max-width: 800px;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
dl,
table,
form,
address {
padding-bottom: 1.5rem;
}

main h1,
main h2,
main h3,
main h4,
main h5,
main h6,
section h1,
section h2,
section h3,
section h4,
section h5,
section h6 {
line-height: 120%;
max-width: 90%;
font-weight: normal;
color: #2F4A60;
}

article footer {
padding-top: 1rem;
text-align: center;
}

h1 {
font-size: 2.25rem;
}

h2 {
font-size: 1.9rem;
}

h3 {
font-size: 1.55rem;
}

#about h1,
h4,
h5,
h6 {
font-size: 1.35rem;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
display: inline-block;
}

.member h2,
.latest h4 {
font-size: 1rem;
font-style:	oblique;
font-weight: normal;
line-height: 120%;
max-width: 640px;
}

.member h2:first-line,
.member h2 a {
font-size: 2.25rem;
font-style:	normal;
line-height: 150%;
}

main ul,
section ul,
main ol {
padding-left: 3rem;
line-height: 150%;
}

section ol {
list-style-position: inside;
}

form ul,
nav ul,
menu {
padding: 0;
list-style:	none;
}

nav li,
nav a,
menu li,
menu a {
display: inline-block;
}

nav a,
menu a {
text-decoration: none;
color: #fff;
padding: 0.5rem 1rem;
margin: 0 0.5rem;
border-radius: 0.1rem;
border:	1px solid transparent;
}

nav li:last-of-type a {
padding-left: 0.75rem;
padding-right: 0.75rem;
}

nav a:hover,
nav a:focus,
nav .active a {
text-decoration: none;
color: #fff;
border:	1px solid #fff;
}

nav a:active {
text-decoration: none;
background:	#152b42;
color: #fff;
}

nav img {
min-width: 18px;
min-height: 18px;
vertical-align: bottom;
}

menu {
text-align:	center;
}

q:before,
q:after {
content: '"';
}

hr {
border:	0;
border-bottom: 1px solid #6C7A89;
margin: 1.5rem 0 3rem 0;
}

mark {
font-style:	oblique;
background:	#f7f7f7;
border-radius: 0.25rem;
padding: 0 0.25rem;
line-height: 150%;
}

table {
padding: 0;
margin-bottom: 1.5rem;
width: 100%;
display: block;
overflow: auto;
}

th,
td {
text-align: left;
vertical-align: top;
background: #fff;
border-radius: 0.25rem;
}

td:first-of-type {
padding-right: 1rem;
padding-bottom: 1rem;
}

th {
font-weight: normal;
line-height: 150%;
}

th:first-line {
font-size: 1.15rem;
}

th strong {
font-weight: 500;
}

table img {
border-radius: 0.25rem;
}

footer dl {
position: absolute;
top: 0;
right: 1rem;
}

#toggle,
ul:empty,
li:empty,
footer dt,
caption {
display: none;
}

dt,
dd,
dd ul,
dd li,
dd a {
display: inline-block;
}

dd ul {
list-style: none;
padding: 0;
}

dd li a {
padding: 0.5rem 1rem
margin-right: 0.5rem;
}

dd li:last-of-type a {
margin-right: 0;
}

dd li a {
padding-left: 2.35rem !important;
background:	url('rss.svg') no-repeat 1rem 50%;
background-size: 16px 16px;
}

abbr {
text-decoration: none;
}

div.member,
article.member,
div.latest {
background: #F7F9FC;
padding: 2rem 2rem 0.5rem 2rem;
margin-bottom: 1.5rem;
border-radius: 0.25rem;
}

article,
section {
padding-bottom: 2rem;
}

section article {
padding-left: 1.5rem;
padding-right: 1.5rem;
}

.excerpt {
font-size: 1.15rem;
}

#search label,
#search legend,
#newsletter label {
display: none;
}

#search fieldset {
border:	0;
padding: 0;
}

#search p {
padding: 0;
display: inline-block;
vertical-align: top;
}

input#txpCommentPreview,
input#h {
margin-right: 0.25rem;
}

#results ol {
padding: 0;
}

#results h3 {
font-size: 1.25rem;
}

#results h3 small {
font-weight: normal;
font-size: 0.9rem;
}

.latest {
text-align: center;
}

.latest ul {
list-style: none;
}

.latest li,
.latest a {
display: inline-block;
}

.latest a {
padding: 0.5rem;
}

#newsletter {
max-width: 100%;
min-height: 520px;
padding: 2rem;
text-align:	left;
}

#newsletter li {
display: inline-block;
}

#kommentit {
font-size: 1.25rem;
font-weight: bold;
}

#txpCommentInputForm p {
padding: 1rem 0 0 0;
}

form#txpCommentInputForm fieldset {
margin: 0 auto;
border:	1px solid #6C7A89;
border-radius: 0.1rem;
padding: 2rem;
text-align:	left;
display: block;
}

#txpCommentInputForm li {
padding-bottom: 1.25rem;
}

#txpCommentInputForm li:last-of-type {
padding-bottom: 0;
}

#cpreview,
.comments li,
p#txpCommentInputForm,
#newsletter,
#popular,
#latest {
border: 1px solid #6C7A89;
background: #E5ECF4;
border-radius: 0.1rem;
margin-bottom: 1.5rem;
}

#cpreview .help {
padding: 1rem;
margin-bottom: 1.5rem;
background:	#6C7A89;
color: #fff;
}

.comments li,
#cpreview .comment,
p#txpCommentInputForm {
padding: 2rem;
}

ol.comments li {
padding: 2rem 2rem 0.5rem 2rem;
}

#kommentit,
.comments h4 {
font-size: 1rem;
}

ol.comments {
padding-left: 0;
padding-right: 0;
list-style:	none;
}

article.currently {
display: inline-block;
vertical-align: top;
width: 24.5%;
min-width: 280px;
}

h4.image {
padding-bottom:	0.25rem;
}

article.currently img,
.image img {
border-radius: 0.25rem;
}

ul.details {
text-transform: uppercase;
list-style: none;
font-size: 0.85rem;
padding-left: 0;
line-height: 100%;
}

ul.details li {
display: inline-block;
padding-right: 0.5rem;
margin-right: 0.5rem;
border-right: 1px solid #6C7A89;
}

ul.details li:last-of-type {
padding-right: 0;
margin-right: 0;
border-right: 0;
}

#about {
background: #F7F9FC;
color: #2F4A60;
padding: 2rem 2rem 0.5rem calc(4rem + 100px);
position: relative;
}

#about + article {
margin-top: 3rem;
}

#about #portrait {
position: absolute;
left: 2rem;
top: 2rem;
}

#about h1 {
font-weight: normal;
}

#about h1 small,
#about h4 small {
font-size: 1rem;
text-transform: uppercase;
display: inline-block;
padding-bottom: 0.5rem;
}

article p:nth-of-type(2) ~ p {
max-width: 740px;
}

section p,
#about p {
max-width: 640px;
}

blockquote {
font: 1.2rem serif;
border-left: 1rem solid #6C7A89;
padding: 2rem 2rem 0.5rem 2rem;
margin-bottom: 1.5rem;
border-radius: 0.1rem;
}

.linklist {
list-style: none;
padding: 0 0 1.5rem 0;
}

.linklist li,
.linklist a {
display: inline-block;
}

.linklist img {
min-height:	20px;
min-height: 20px;
}

@media (max-width: 1300px) {
nav a,
menu a {
padding-left: 0.5rem;
padding-right: 0.5rem;
margin: 0 0.5rem;
}
main {
max-width: calc(700px - 4rem);
}
}

@media (max-width: 1200px) {
body {
padding: 0;
}
#main {
padding: 1rem 2rem;
}
#hamburger nav {
display: none;
}
#hamburger.open {
text-align: right;
}
#hamburger.open nav {
display: block;
z-index: 4;
background: #2F4A60;
border-radius: 0.1rem;
border-bottom: 0.5rem solid #E5ECF4;
}
#toggle {
display: inline-block;
margin: 0;
}
#hamburger.open nav li,
#hamburger.open nav a {
display: block;
margin: 0;
}
#hamburger.open nav a {
padding: 0.25rem 1rem;
}
#hamburger.open img {
max-height:	18px;
margin:	0.25rem 0;
}
#hamburger.open .active a {
background: #0B1F33;
border: 0;
}
}

@media (max-width: 1100px) {
main footer {
text-align: center;
padding: 0 0 2rem 0;
}
footer dl {
position: static;
padding: 3rem 0;
}
main {
max-width: calc(700px - 4rem);
}
aside {
max-width: calc(300px - 4rem);
}
#newsletter {
padding-left: 1rem;
padding-right: 1rem;
padding-bottom: 1rem;
}
input[type='email'] {
width: 100%;
}
}

@media (max-width: 1000px) {
main,
aside {
width: auto;
display: block;
float: none;
}
}

@media (max-width: 900px) {
article.currently {
width: auto;
}
aside {
width: auto;
max-width: 100%;
padding: 0;
}
}

@media (max-width: 600px) {
#about {
padding: 1rem 1rem 0.5rem calc(3rem + 100px);
}
#about p {
font-size: 0.9rem;
}
#about #portrait {
left: 1rem;
top: 1rem;
}
#home {
padding-left: 2rem;
padding-right: 2rem;
}
#home h2 {
font-size: 1.5rem;
}
#home p {
font-size: 1.1rem;
}
}