/* CSS Document horzscroll by https://codepen.io/designcourse */
/*
body {
  margin: 0;
  height: 100vh;
  font-family: "Lato";
}
*/

.horzscroll IMG {
max-width:20vw;
}

.wrapper {
  overflow-x: hidden;
  position: relative;
}

* {
  box-sizing: border-box;
}
/*
svg {
  position: absolute;
  top: 12em;
  left: 10vw;
  width: 50vw;
}
svg .mask {
  width: 0;
}
*/
.container2 {
  display: flex;
  width: 150vw;  /* 300 -> 150*/
  top: 40px;  /* new: for mobile */
}
.container2 .col {
  display: flex;
  gap: 3em;
}
.container2 .col p {
  font-size: 0.8rem;
}
.container2 section {
  /* width: 100vw;
  padding: 20vw 10vw; */
  width: 34vw;
  padding: 10vw 5vw;
}
.container2 section h1 {
  font-size: 3rem;
  margin: 0;
}
.container2 section p {
  font-size: 1.2rem;
  width: 50vw;
}
.container2 section ul {
  list-style-type: none;
  display: flex;
  gap: 3em;
  width: 100%;
  height: 100px;  /* 300 -> 100 */
  padding: 0;
}
.container2 section ul li {
  background: white;
  border-radius: 0.3em;
  flex-grow: 1;
}

.container2 section {
  height: 74vh;  /* 100 */
}


@media (max-width: 767px) {
.horzscroll IMG {
max-width:80vw;
}


.container2 {
  display: flex;
  width: 100vw;  /* 300 -> 150*/
}
.container2 section {
  /* width: 100vw;
  padding: 20vw 10vw; */
  width: unset;
  padding: 20vw 15vw;
}
.container2 section h1 {
  font-size: 2rem;
  margin: 0;
}



}