summary {
  background-color: #15B9D9;
  color: white;
  padding: 10px;
  border-radius: 5px;
  font-size:1.4em;
  text-align:left;
}

details[open] summary {border-radius: 5px 5px 0 0;}

details {
  background: #C2F1FA;
  border-radius: 5px;
}

/* extra styles */

* {box-sizing: border-box;}
/*body {font-family: system-ui, sans-serif; margin: 20px; background: #fff9f1;}
h1 {font-size: 1.2em;}*/
article > *:first-child {margin: 0;}
article > * + * {margin: 0.75em 0 0 0;}
pre {color: white; background: #455e7b; padding: 1em; border-radius: 5px;}
article {padding: 10px; margin: 0;}
details code {font-size: 1.1em;}

summary::marker {
  color: #FFFFFF;
  font-size: 1.4em;
}