body {
  margin: 0;
}

/* Text*/

.main {
    font-family: 'Source Sans Pro', sans-serif;
    overflow-y: scroll;
    display: grid;
    font-size: large;
    grid-row-gap: 10px; 
    padding: 10px;
}

.wrapper-center{
    position: absolute;
    text-align: center;
    width: 100%;
    left: 0px;
}

.wrapper-left{
    position: absolute;
    text-align: left;
    width: 90%;
    left: 5%;
}

/* Videos */
video {
  width: 100%;
  object-fit: contain;
  position: relative;
}

/* Lists */

li {margin-bottom: 20px;}
.items {font-weight: 700; font-size: 120%;}

input {display: none; visibility: hidden;}
label {display: inline;}
label:hover {color: #0000ff;}
label::after {content: "▲";}
#expand001, #expand002, #expand003 {display: inline; height: auto; object-fit: cover; overflow: hidden; transition: height 2s;}
#toggle001:checked ~ #expand001 {display: none; height: auto;} #toggle001:checked ~ label::after {content: "▼";}
#toggle002:checked ~ #expand002 {display: none; height: auto;} #toggle002:checked ~ label::after {content: "▼";}
#toggle003:checked ~ #expand003 {display: none; height: auto;} #toggle003:checked ~ label::after {content: "▼";}

/* Background visualization */

canvas {
  display: block;
  vertical-align: bottom;
}

#particles-js {
  position: fixed; /*absolute*/
  width: 100%;
  height: 100%;
  background-color: #ffffff;
  background-image: url("");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
}