
:root {
  font-size: calc(0.5em + 1vw);
  /*font-size: calc([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width]) / ([maximum viewport width] - [minimum viewport width])));*/
  /*font-size: calc(14px + (26 - 14) * ((100vw - 300px) / (1600 - 300)));*/
  /*font-size: 1em;*/
}

html {
  /*font-size: 100%;*/
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  box-sizing: border-box;
}

/*set all elements to use border-box model*/
*, *::before, *::after {
  box-sizing: inherit;
}


body {
  background-position: center;
  /*line-height: 1em;*/
}

@media (prefers-color-scheme: dark) {
  html {
    background: #000;
    color: #fff;
  }
  img {
    opacity: .75;
    transition: opacity .5s ease-in-out;
  }
  img:hover {
    opacity: 1;
  }
}

@media (prefers-color-scheme: light) {
  html {
    background: #fff;
    color: #000;
  }
}
/*
header {
  height: 1vh;
  line-height: normal;
}
*/
nav {
  clear: both;
  background-color: #aeaca8;
  viewport-fit: inherit;
  /*line-height: normal;*/
}

nav ul {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  list-style-type: none;
}

nav ul li {
  margin: 0.5em 1em;
}

nav li a:hover, nav li {
  color: #000000;
}

section.top-articles {
  border-right: 1px solid #eeeeee;
}

main{
  display: flex;
}

main section {
  width: 70%;
}

main aside {
  width: 30%;
}

article {
  clear: both;
  overflow: auto;
  width: 100%;
}

aside {
  padding: 0px 0px 0px 20px;
}

aside section a {
  display: block;
  padding: 10px;
  border-bottom: 1px solid #eeeeee;
}

aside section a:hover {
  color: #984d6a;
  background-color: #efefef;
}

a {
  color: #de6581;
  text-decoration: none;
}

h1, h2, h3 {
  font-weight: normal;
}

h2 {
  margin: 10px 0px 5px 0px;
  padding: 0px;
}

h3 {
  margin: 0px 0px 10px 0px;
  color: #de6581;
}

aside h2 {
  padding: 30px 0px 10px 0px;
  color: #de6581;
}

footer {
  clear: both;
  height: 50px;
  font-size: 80%;
}

footer ul {
  list-style: none;
}

.site-footer-container{
  display: flex;
  flex-direction: row;
  justify-content: space-around;
}

.footer-list {
  padding-inline-start: initial;
}

.footer-social-media  {
text-align: center;
}

.footer-social-media img {
  width: 2rem;
  height: 2rem;
  margin-left: .5em;
  margin-right: .5em;
}

.footer-copyright {
  text-align: center;
}