h1 {
font-size: 56pt;
margin: 5%;
text-align: center;
}

h2 {
font-size: 16pt;
}

h3 {
font-weight: bold;
margin: 0;
padding: 0;
text-align: left;
}

h4 {
margin: 0;
padding: 0;
text-align: left;
font-size: 12pt;
font-weight: bold;
text-decoration: underline;
}


.main-frame {
border: 1pt solid black;
width: 70%;
height: auto;
margin: auto;
padding: 2%;
text-align: center;
margin-top: 10%;
margin-bottom: 10%;
box-shadow: 0 5px 5px 0 grey;
margin-bottom: 20%;
}


.header {
display: inline;
}

hr {
width: 90%; 
height: 3px; 
background-color: black;
margin-left: 0;
display: inline-block;
}

body, p {
font-family: 'Space Grotesk', sans-serif;
font-weight: normal;
text-align: left;
}

img.img_0009.jpg {
height: 30px;
width: auto;
}

marquee {
height: 30px;
width: auto;
color: white;
font-size: 12pt;
line-height: 30px;
}

.intro {
margin-top: 3%;
margin-bottom: 10%;
width: 70%;
height: auto;
text-align: left;
}

.column2 {
  float: left;
  width: 50%;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}


.projects {
width: 100%;
height: auto;
padding-top: 10%;
}

.curiouser, .about-me {
  text-align: left; 
  height: auto;
}

.explanation {
height: auto;
text-align: left;
width: 70%;
padding-left: 10%;
}

details {
  user-select: none;
}

.role {
  border: 1pt solid black;
  padding: 2%;
  width: 35%; 
  height: auto;
  margin: 0 5% 0 5%;
  text-align: left;
  display: inline-block;
  vertical-align: top;
}

p1 {
  font-size: 10pt;
}

details>summary span.icon {
  width: 24px;
  height: 24px;
  transition: all 0.3s;
  margin-left: auto;
}

details[open] summary span.icon {
  transform: rotate(180deg);
}

summary {
  display: flex;
  cursor: pointer;
  margin-bottom: 20pt; 
}

summary::-webkit-details-marker {
  display: none;
}

ul {
      margin: 0;
		text-align: left;
      }
      ul.dashed {
        list-style-type: none;
      }
      ul.dashed > li {
        text-indent: -20px;
      }
      ul.dashed > li:before {
        content: "-";
        text-indent: -20px;
      }

img.notes1.png {
  height: 50px;
}


.the-credits {
width: 10%;
}