@import "navbar.css";
@import "gallery.css";
@font-face {
  font-family: 'Jost';
  font-display: swap;
  src: url(/Jost.ttf) format('truetype');
}
:root {
  --light: #888888;
  --dark: #000000;
  --main: #1174df;
}

body,
html {
  font-family: "Jost", sans-serif, "Noto Color Emoji",
    "Apple Color Emoji", "Segoe UI Emoji";
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
  color: var(--main);
}

a:hover {
  text-decoration: underline;
}

a[aria-disabled="true"] {
  cursor: default;
  color: hsl(211, 85%, 60%);
  text-decoration: none;
}

header {
  padding: 2rem 1rem;
  color: #fff;
  background: rgb(11, 69, 135);
  background: linear-gradient(
    22deg,
    rgba(11, 69, 135, 1) 0%,
    rgba(20, 118, 222, 1) 100%
  );
  box-shadow: 0 0.2rem 0.5rem 0 rgba(0, 0, 0, 0.4);
}
header > h1 {
  color: #fff;
}

main,
footer {
  padding: 1rem;
}
img {
  max-width: 100%;
  max-height: 22rem;
}

table th {
  text-align: left;
}
@media screen and (max-width: 750px) {
  img,
  iframe,
  input,
  textarea {
    width: 95%;
    max-height: unset;
  }

  #menu > a {
    padding: 0.25rem 0;
    float: right;
    width: 100%;
  }
}

hr {
  color: var(--light);
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.muted {
  color:rgba(0, 0, 0, 0.4);
}

i.youtube {
  width: 0;
  height: 0;
}
i.youtube::before {
  content: "";
  display: inline-block;
  margin-bottom: -0.25em;
  height: 1.3em;
  width: 1.5em;
  background: url(/youtube.svg) no-repeat;
}