/**
 * *NOTE*
 * I include this file with most projects I make,
 * it is for "normalizing" styles across various
 * browsers because sometimes the default styles
 * look a little different. I.e. browsers will
 * sometimes have a default margin to the body
 * element. This removes that and it then adds
 * a border to the html and body elements to
 * make them clearer; this can be overridden by
 * another stylesheet after it is included. It
 * also adds some bugfixes, some of which may
 * be outdated or already mostly fixed but I
 * include them anyway in case it is an outdated
 * browser.
 */

/**
 * global overrides to prevent weird behavior
 * on mobile
 */
 *{
  text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-modify: none;
  -moz-user-modify: none;
  -webkit-user-callout: none;
  -webkit-user-drag: none;
  -webkit-highlight: none;
  -webkit-touch-callout: none;
  scroll-behavior: smooth;
}

img{
  /* prevent accidental selection */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  /* but still keep touch-callout on mobile */
  -webkit-touch-callout: default;
}

:root{
  font-family: 'Times New Roman';
  font-size: 16px;
}

/* actual styling, not bugfixes */
*{
  box-sizing: border-box;
}

html, body{
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 5px solid;

  margin: 0;
  padding: 0;
}

html{
  overflow: hidden;
  border-color: blue;
}

body{
  overflow: auto;
  border-color: green;
}