:root {
  --primary-color: #d4202e;
  --secondary-color: #424242;
  --background-color: rgba(255, 255, 255, 0.1);
  --background-image: url("background.png");

  --size-screen-width: 1920px;
  --size-screen-height: 1080px;
  --size-content-width: 1520px;
  --size-content-height: 980px;
}

html {
  box-sizing: border-box;
}

*,
:after,
:before {
  box-sizing: inherit;
}

html,
body {
  margin: 0px;
  padding: 0px;
  height: 100%;
  width: 100%;

  width: var(--size-screen-width);
  height: var(--size-screen-height);

  overflow: hidden;
  user-select: none;
}

body {
  background: white;

  background-image: var(--background-image);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;

  font-family: "Open Sans", sans-serif;
  /* letter-spacing: -0.1rem; */
}

main {
  display: flex;

  height: var(--size-content-height);
  width: var(--size-screen-width);
}

#content-iframe {
  width: var(--size-content-width);
  height: var(--size-content-height);
  border: none;
}

main,
footer {
  background: var(--background-color);
}

aside {
  width: calc(var(--size-screen-width) - var(--size-content-width));
  padding: 20px;
}

header {
  border-bottom: 1px solid #ddd;
  padding-bottom: 20px;

  text-align: center;
}

#logo {
  display: block;
  width: 100%;
  height: auto;
}

#time,
#date {
  padding-top: 20px;
}

#time {
  font-size: 60px;
}

#date {
  font-size: 24px;
}

h1 {
  text-align: center;
  font-weight: bold;
  font-size: 40px;
  margin: 20px 0;
}

nav a {
  display: block;

  width: 100%;

  padding: 30px 10px;

  border-radius: 10px;

  background: var(--primary-color);
  border: 5px solid var(--primary-color);

  margin-bottom: 20px;

  text-decoration: none;

  color: white;
  text-align: center;
  font-size: 20px;
  font-weight: bold;
}

nav a.link--active {
  border: 5px solid var(--secondary-color);
}

footer {
  width: var(--size-screen-width);
  height: calc(var(--size-screen-height) - var(--size-content-height));
  padding: 20px;
}

#feed-content {
  height: 50px;
  line-height: 50px;
  font-size: 24px;
}

#feed-source {
  height: 10px;
  line-height: 10px;
  font-size: 10px;
  font-style: italic;
}