/** Header css **/
/* Chcem aby logo a nazov stranky boli vedla seba */
header#top {
  display: inline-flex;
}
/* Velkost loga v headery */
img#logo {
  height: 150px;
}
/* Velkost nav baru na stranke, border none lebo chcem aby nav vyzeral ako sucast stranky, nie ako iframe */
iframe#nav {
  border: none; 
  width: 100%; 
  height: 66px; 
}

/* Odtranenie paddingu a borderu v nav.html, prepisuje vseobecny body paading a border */
body#nav_bar {
  padding: 0;
  border: 0;
}
/* Chcem aby cleny nav baru boli vedla seba */
body#nav_bar > nav > menu {
  display: flex;
}
/* Chcem aby cleny nav baru zaberali celu sirku displaya */
body#nav_bar > nav > menu > li {
  flex: auto;
}

/** Main body css **/
/* Vseobecny, vsade uplatneny look - farba pozadia, farba textu, font, odsadenie od okrajov a border */
body {
  background-color: black;
  color: white;
  /* Font z https://fonts.google.com/specimen/Quantico */
  font-family: Quantico;
  font-style: normal;
  font-weight: 500;
  padding: 4%;
  border: 2px solid white;
}
/* Image sa priblizi ak nan dam mys */
img:hover {
  transform: scale(1.2);
  transition: calc(1500ms);
}
/* Chcem aby linky boli biele ako zbytok textu, necham podciarknute */
a {
  color: white;
}
/* Velkost obrazkov v kexte */
img.icon {
  width: 20px;
}
/* Ohranicenie tabulky a jej clenov */
table, tr, td {
  border: 1px solid white;
}

/** Vlastnosti body > main (pouziva sa na strankach jednotlivych vtuberov)  **/
/* Chcem aby cleny main boly vedla seba */
body > main {
  display: flex;
  flex-direction: row;
}
/* article obsahuje hlavny text */
body > main > article {
  padding: 0.5%;
}
/* aside obsahuje profilovu fotku a menej dvolezity text */
body > main > aside {
  padding: 0.5%;
  border: 1px solid white;
}
/* Velkost profilovej fotky v aside */
body > main > aside > img {
  width: 300px;
}