styles.css

body { font-size: 14px; text-align: left; font-family: "Merriweather"; background-color: #cccccc;}
body #main-container h1 { font-size: 3.0em; text-transform: capitalize; font-family: "Roboto" ;  font-weight: 400;}
body h2 { margin-top: 1.5em; font-size: 2.0em; color: rgb(77, 148, 248);}
body h3 { margin-top: 1.5em; font-size: 1.6em; }
body h4 { margin-top: 1.5em; font-size: 1.2em; }
body h5 { margin-top: 1.5em; font-size: 1em; }


h1, h2, h3, h4, h5{ line-height: 1.3; }
p { line-height: 2; }

#main-container { width: 100%; background-color: white; color: black; padding: 30px; margin-left: auto; margin-right: auto; }
#chunks {background-color: rgb(238, 244, 162);}


#header { color: white; margin-left: auto; margin-right: auto; 
  text-align: center; line-height: 1.5; width: 100%; padding: 5%; 
  background: linear-gradient(to bottom, rgba(0, 15, 80, 0.957), rgba(1, 76, 97, 0.9), rgb(233, 240, 28, 0.7), rgb(238, 247, 120)), url("images/bkgd.png");
  /* url("images/bkgd.png"); */
  /* background-image: url("images/bkgd.png"); */
  background-position: bottom;
  background-repeat: repeat-y;
  opacity: 1.0; 
  background-size: contain;
}
#header big{ color: white; font-family: "Anton"; }

#header h1 { font-size: 2.8em; text-transform: capitalize; font-family: "Roboto"; font-weight: 900; }

#header .subtitle{ font-size: 2.2em; color: black;  text-transform: capitalize; font-family: "Roboto"; font-weight: 500; text-align: center; line-height: 1.3; padding: 20px; }

#header .date{ font-size: 16px; } 

/* #header img{ width:90%; background: rgba(232, 245, 92, 0.991);background-size: cover; } */

a{ color: #0786f3; }

.author{ display: none; }

.date{ color: #6c6c6c; font-family: "Merriweather"; font-weight: normal; }

table tbody tr td { font-size: 12px; text-transform: capitalize; }

body img{ width: 90%; display: block; margin-left: auto; margin-right: auto; }

#footer { height: auto; font-size: 90%; background-color: #000000; color: white; padding: 20px}

#footer a{ color: rgb(82, 214, 247)}

blockquote { color: #6c6c6c; padding: 10px 20px; margin: 0 0 20px; font-size: 14px; border-left: 5px solid #ddd; }

hr { display: inline-block; text-align: left; margin: 0px; height: 1px; border: none; background-color: #c6bc04; }

code{ color:#6c6c6c; font-size: 98%; background-color: #f5f5f5; }

@media only screen and (max-width: 768px) { .main-container { max-width: 100%; padding: 2% 2% 2% 2%; }}

header img{ width: 100%; display: block; margin-left: auto; margin-right: auto; }


 div.sourceCode {
  position: relative;
}

.copy-to-clipboard-button {
  position: absolute;
  right: 0;
  top: 0;
  visibility: hidden;
}

.copy-to-clipboard-button:focus {
  outline: 0;
}

div.sourceCode:hover > .copy-to-clipboard-button {
  visibility: visible;
}

.leaflet-contaioner {
  background: red;
}