/* Based on encommon.webkit default.css */



/***********************************/
/* Colors used throughout the site */
/***********************************/

:root {

  --background: 242, 186, 197;        /* f2bac5 */
  --foreground: 250, 250, 250;        /* fafafa */

  --scroll: 232, 79, 125; }           /* e84f7d */



/***********************************/
/* Colors used throughout the site */
/***********************************/

html.night:root {

  --background: 22, 69, 117;          /* 164575 */
  --scroll: 198, 248, 255; }          /* c6f8ff */



/***********************************/
/* Colors used throughout the site */
/***********************************/

:root {

  --color-blue-dark: 22, 69, 117;     /* 164575 */
  --color-blue-lite: 198, 248, 255;   /* c6f8ff */

  --color-pink-lite: 255, 214, 235;   /* ffd6eb */
  --color-pink-dark: 232, 79, 125; }  /* e84f7d */



/***********************************/
/* Colors used throughout the site */
/***********************************/

:root {

  --social-discord: 88, 101, 242;     /* 5865f2 */
  --social-reddit: 255, 60, 0;        /* ff3c00 */
  --social-instagram: 231, 32, 133;   /* e72085 */
  --social-youtube: 255, 0, 0; }      /* ff0000 */



/************************************/
/* Initial default for all elements */
/************************************/

* {
  border-collapse: collapse;
  border-spacing: 0;
  border-width: 0;
  box-sizing: border-box;
  color: rgba(var(--foreground), 1);
  font-family: 'Roboto';
  font-size: 1vw;
  font-style: normal;
  font-weight: normal;
  letter-spacing: .05rem;
  line-height: 1vw;
  list-style-type: none;
  margin: 0;
  outline: none !important;
  padding: 0;
  page-break-after: avoid;
  page-break-before: avoid;
  page-break-inside: avoid;
  scroll-behavior: smooth;
  text-align: left;
  text-decoration: none;
  vertical-align: middle;
  white-space: nowrap; }


@media (max-width: 800.00px) {

  * {
    font-size: 2vw;
    letter-spacing: .1rem;
    line-height: 2vw; } }



/**********************************/
/* Elements which are very common */
/**********************************/

body {
  background-attachment: fixed;
  background-color: rgba(var(--background), 1);
  background-image: url('../ndsplash.jpg');
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  justify-content: center;
  transition:
    background-color 300ms ease-in-out,
    background-image 300ms ease-in-out; }


html.night body {
  background-image: url('../ndnight.jpg'); }


@media (max-width: 800.00px) {

  body {
    background-position: center left 30%; } }



/**********************************/
/* Elements which are very common */
/**********************************/

a, b, i, li, p, span {
  white-space: normal; }

a, b, i, span {
  color: inherit;
  line-height: inherit;
  font-size: inherit;
  white-space: inherit; }



/**********************************/
/* Elements which are very common */
/**********************************/

a { cursor: pointer; }
b { font-weight: bold; }
i { font-style: italic; }



/************************************/
/* Styles for scroll bar and handle */
/************************************/

::-webkit-scrollbar {
  background-color: transparent;
  height: 1rem;
  width: .9rem; }

::-webkit-scrollbar-thumb {
  background-clip: padding-box;
  background-color: rgba(var(--scroll), .8);
  border-color: transparent;
  border-radius: .5rem;
  border-style: solid;
  border-width: .2rem; }

::-webkit-scrollbar-thumb:hover {
  background-color: rgba(var(--scroll), 1); }

::-webkit-scrollbar-corner {
  background-color: transparent; }