/* --------Basic setup-------*/

* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Root */
:root {
  font-size: 16px;
  font-family: "Gayathri", sans-serif;
  --text-primary: white;
  --text-secondary: grey;
  --bg-primary: #23232e;
  --bg-secondary: #141418;
}

html {
  background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.2)),
    url(img/nightsky.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

/* Might be needed (removes vertical scrollbar from the browser window */
/* ::-webkit-scrollbar: {
  display: none;
} */
header {
  text-align: center;
}

body {
  min-height: 100vh;
}

.navbar-nav {
  list-style-type: none;
}

.nav-item a,
active,
visited {
  color: var(--text-primary);
  text-decoration: none;
  letter-spacing: 2px;
  text-shadow: 1px 1px black;
  display: inline;
}
.nav-item a:hover {
  color: var(--text-secondary);
  text-shadow: 1px 1px black;
  background-color: grey;
  text-decoration: underline;
}

.nav-item a:visited {
  color: white;
  text-shadow: 2px 2px black;
}

.webdev-playground {
  color: var(--text-primary);
  text-align: center;
  padding: 398px 0;
  text-shadow: 1px 1px black;
  letter-spacing: 2px;
}