body {
  font-family: "Trebuchet MS", Arial; /* Bestämmer textens typsnitt. Trebuchet MS i första hand, annars sans-serif */
  background-color: #b1b1b1; /* Sätter bakgrundsfärg på hela sidan (ljusgrå) */
  text-align: center; /* Gör så att all text centreras */
}

header h1 {
	font-family: "Comic sans" ;
  font-size: 38px; /* Gör rubriken stor */
  color: #000000; /* Standardfärg på h1 texten (svart) */
  margin: 2; /* Tar bort extra mellanrum ovanför/under rubriken */
}

h3 {
	font-family: "Bradley Hand ITC", sans-seriff ;
  font-size: 20px; /* Gör rubriken stor */
  color: #2E8B56; /* Standardfärg på h1 texten */
  margin: 2; /* Tar bort extra mellanrum ovanför/under rubriken */
}

h4 {
	font-family: "Comic Sans", sans-seriff ;
  font-size: 30px; /* Gör rubriken stor */
  color: #2F4F4F; /* Standardfärg på h1 texten */
  margin: 0; /* Tar bort extra mellanrum ovanför/under rubriken */
}

nav {
  background-color: #008080; /* Sätter bakgrundsfärg på menyområdet  */
}

nav a {
  margin: 0 12px; /* Ger 12px mellanrum till höger och vänster om varje länk */
  color: #FFFAFA; /* Färg på länkarna */
  text-decoration: none; /* Tar bort understrykningen på länkar */
  font-size: 20px; /* Gör länkarna lite större än standardtexten */
}

nav a:hover {
  text-decoration: underline; /* När man för musen över en länk blir den understruken */
  color: #C0C0C0;
}

main p {
  font-size: 20px; /* Gör texten i paragrafen större */
  color: #2F4F4F; /* Gör texten blå med RGB-värden */
  margin: 20px 0; /* Ger luft (20px) ovanför och under texten */
}

#demo {
	color: #FF1493 !important;
	font-family: 'Arial', sans-serif !important;
	font-size: 40px !important;
	font-weight: bold !important;
}

p a {
  margin: 10px; /* Ger 10px mellanrum till höger och vänster om varje länk */
  color: #663399; /* Färg på länkarna */
  text-decoration: none; /* Tar bort understrykningen på länkar */
  font-size: 20px; /* Gör länkarna lite större än standardtexten */
}
  
 p a:hover {
  text-decoration: underline; /* När man för musen över en länk blir den understruken */
  color: #FF1493;
  }

img {
  max-width: 100%; /* Gör så att bilden aldrig blir bredare än skärmen */
  margin-top: 30px; /* Skapar luft ovanför bilden */
  }

img[src$=".jpg"], /* Gör så att det bara blir en ram på de bilder med en jpg eller jpeg ändelse
img[src$=".jpeg"] {
  border: 4px solid #008080; /* Ger bilden en kantlinje (3px tjock) */
}