style.css

/*.container {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}*/



/*@media (min-width:320px) and (max-width:767px) {
  .container>div {
    width: 90%;
  }
}

@media (min-width:768px) and (max-width:1023px) {
  .container>div {
    width: 45%;
  }
}

@media (min-width:1024px) {
  .container>div {
    width: 30%;
  }
}*/

  #logo_desktop{
   display:block;
   width: 80%;
   margin: 0 auto;
  }

 #logo_mobile{
  display:none;
 }

@media (max-width: 640px) and (min-width: 320px){
  #logo_desktop{
   display:none;
  }

  #logo_mobile{
   display:block;
   width: 80%;
   margin: 0 auto;
  }
}



.container {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 2em;
}

.container > div {
  grid-column: span 4 / span 4;
}

@media (max-width: 1023px) {
  .container > div {
    grid-column: span 6 / span 6;
  }
}

@media (max-width: 767px) {
  .container > div {
    grid-column: span 12 / span 12;
  }
}

.container>div {
  /*margin: 0.5em;*/

}

.container>div>img, .container>div>video {
  width: 100%;
}

/* ----------------------------------------------- */

.fwn {
  font-weight: normal;
}

.fwb {
  font-weight: bold;
}

.i {
  font-style: italic;
}

h1, h2, h3 {
  font-family: Helvetica;
}

pre {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}