/*
THE STYLESHEET FOR A SAMPLE ARTICLE
if the code doesn't work - it was intentional and satire
*/


/* the main styling for the page: background colour, font, some text formatting */
html {
  background-color: #EDE8D0;
  font-family: "Newsreader", serif;
  line-height: 1.5;
}

body {
  /* fixes some scaling stuff, for some reason */
  margin: 0;
}

/* used for styling the bulk of the page */
.container {
  /* the below two lines makes the page squash for a cleaner look */
  margin: 0 auto;
  width: 90%;
  /* this is arbitrary, otherwise it started moving the buttons onto a new line */
  min-width: 600px;
}

/* for the main title of the page */
h1 {
  /* if you don't set it to zero, you can't manipulate it as easily */
  margin: 0;
  /* gives 20px of space all around the title */
  padding: 20px;
  font-size: 40px;
  text-align: center;
  /* for the line underneath separating the page content */
  border-bottom: 2px solid black;
}

/* for styling the intro picture and paragraph */
.block1 {
  margin-top: 20px;
  margin-bottom: 20px;
  /* the below two lines allow the image and paragraph to align at the centre */
  display: flex;
  align-items: center;
}

/* uses the same format as block 1 because I'm a fraud coder and don't know
how to make them use the same styling */
.block2 {
  margin-top: 20px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
}

.block1 img {
  height: 750px;
  width: 750px;
  /* gives it some space before the text */
  margin-right: 50px;
}

.block2 img {
  height:250px;
  width: 250px;
  /* gives it some space after the text */
  margin-left: 20px;
}