@charset "UTF-8";

:root {
	--light:rgba(127, 255, 127, 0.7);
	--dark:rgba(0, 31, 0, 0.75);
}

body {
	display: grid;
	justify-content: center;
	grid-template-areas: '. header .' '. main .' '. footer .';
	background-image: url("./bkgd.svg");
	background-color: black;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	border-style: none;
	min-height: 100vh;
}


header {
	grid-area: header;
	border-style: none;
}
main 
{
	max-width: 40em;
	grid-area: main;
	border-style: none;
	background-color: none;
	padding: 2em;
}
footer {
	grid-area: footer;
	border-style: none;
}
div {
	border-style:solid;
	border-width: 0.5em;
	border-color: var(--light);
	background-color: var(--dark);
	padding: 1em;
	color: var(--light);
	font-family: 'Bitter', serif;
	font-size:2em;
}
h1 {
	font-family: 'Montserrat', sans-serif;
	font-size:5em;
	color: var(--light);
	text-align: center;
}
h2 {
	font-family: 'Montserrat', sans-serif;
	font-size:3em;	
	color: var(--light);
	text-align: center;
	font-style:bold;
	font-weight:700;
}
h3 {
	font-family: 'Monserrat', sans-serif;
	font-size:2em;	
	color: var(--light);
	text-align: center;
	font-style:italic;
	line-height: 1.2; 
}
p {
	font-family: 'Bitter', serif;
	font-weight:100;
	font-size:1em;
	line-height:1.5em;
	color: var(--light);
	text-align: justify
}

hr {
    height: 1px;
    color: var(--light);
    background-color: var(--dark-color);
    border: none;
}

.img0 { 
      float: left; 
      margin: 1em;
      border-radius: 8px; 
      border: 1px solid var(--light);
      border-radius: 4px;
      padding: 5px;
      width: 150px;
    } 
.img1 { 
      margin: 1em;
      border-radius: 8px; 
      border: 1px solid var(--light);
      border-radius: 4px;
      padding: 5px;
    }
    
a {
  color: var(--light);
}