/* Delete this comment-header when finalized for fullsite use. Test all styling for "TESTPAGE.HTML" here, and ONLY here, until the site visuals/layout is as I like it. Create additional designated testpages ("testpageA", "testpageB") to test navigation if I like, and make sure the header/navbar works as I intend it; remember to clean these up before creating the site.
Download any pages I want to keep, such as the dangle-tutorial, before cleaning off Neocities (and sort them into 'retained website files', separate from the working files I'm using)
Optionally, if I have the spoons while editing, keep a list of what visual assets are used where, for later reference. Or/and, a 'sitemap' of which pages exist and where they link.
*/

/*   !==DEFAULTS/FALLBACKS== */

body { /* Targets *everything* within the 'body' section of the page, unless overwritten by a div/container/etc. This is the 'default' or 'baseline', only seen if a div fails or text is left plain. */
/* v Sets default text options, like font, color, size */
  font-family: 'KodeMono', 'Play', Helvetica, sans-serif;
  color: white;
  paint-order: stroke fill;
  -webkit-text-stroke: 0.1em #0D7E93;  /* adds a stroke around your text of the specified dimensions and color */
/* v Sets margins/padding, for spacing. Margins are border-out, padding is border-in. */
  margin: 0px;
  padding: 0px;
/* v Sets background image for the whole of the site within 'body' */
	background-image: url('images/backgrounds/greyclouds-halved.jpg'); /* sets a background image; will tile by default*/
	background-repeat: no-repeat;
  background-attachment: fixed; /* can be set to 'fixed' and not scroll, or 'scroll', where it will scroll */
	background-size: cover;
	background-position: center bottom;
}

p {
  margin: 0px;
  padding: 0px;
}

/*   !==CUSTOM ITEMS== */

.testDiv {
  border: 4px double white;
  background-color: black;
  padding: 5px;
  display: flex;
}

.testComm {
  border: none;
  background-color: blue;
  margin: 0px;
  padding: 0px;
  font-family: 'Play', Helvetica, sans-serif;
  /* display: flex; */
}

.testComm.h3 {
  font-family: 'Header', Helvetica, sans-serif;
}

.testCommImg {
  border: 2px white;
  background-color: cyan;
  background-repeat: no-repeat;
  background-attachment: fixed; /* change to 'scroll' when actual image, so it displays thumb as-is */
  background-size: cover;
  width: 200px;
  height: 100px;
}

.textCalmBox {
  background-color: grey;
  background-image: url('images/backgrounds/textbox-smol.jpg')
  background-repeat: repeat;
  background-size:cover;
}

.scrollSpace { /* test block creating a tall site to allow scrolling */
  height: 12000px;
}

/*   !==LOADED FONTS== */

@font-face { /* sample of installing a custom font; pull from the local filepath, name the font-family on it, optionally add font-style: italic/bold; tag */
	  font-family: Play; /* what you're naming the font on this site; keep consistent between pages, or use stylesheet */
	  src: url('fonts/Play-Regular.ttf');  /* url to your hosted font .ttf */
}
  
@font-face {
  font-family: KodeMono;
  src: url('fonts/KodeMono-VariableFont_wght.ttf');
}