
h1{
  color: #03011F;
  text-align: center;
}
h2{
  color: #03011F;
  text-align: center;
}
h3{
  color: #03011F;
  text-align: center;
}
h4{
  color: #03011F;
  text-align: center;
}

.grid-container {
  display: grid;
  grid-auto-columns: auto;
  grid-auto-rows: auto;
  gap: 1em;
  grid-template-areas: 
  "box-6 box-6 box-6 box-6"
  "box-4 box-4 box-2 box-3"
  "box-1 box-1 box-2 box-3"
  "box-1 box-1 box-2 box-3"
  "box-1 box-1 box-5 box-5";
}

@media(max-width: 56em){
  .grid-container{

  grid-template-areas: 
  "box-6 box-6 box-6"
  "box-4 box-2 box-3"
  "box-1 box-2 box-3"
  "box-1 box-2 box-3"
  "box-1 box-2 box-3"
  "box-5 box-5 box-5";

  }
}
@media(max-width: 42em){
  .grid-container{

  grid-template-areas: 
  "box-6 box-6"
  "box-4 box-4"
  "box-1 box-1"
  "box-2 box-2"
  "box-2 box-2"
  "box-3 box-3"
  "box-5 box-5";
  }
}

.item1 {
  padding: 1em;
  background-color: #900A19;
  color: #FA1942;
  text-align:start;
  border-radius: 8px;
  font-size: 2rem;
}
.item2 {
  padding: 1em;
  background-color: #900A19;
  color: #03011F;
  text-align: justify;
  border-radius: 8px;
  font-size: 2rem;
}
.item3 {
  padding: 1em;
  background-color: #900A19;
  color: #FA1942;
  text-align: justify;
  border-radius: 8px;
  font-size: 2rem;
}
.item4 {
  padding: 1em;
  background-color: #ff020263;
  color: #03011F;
  text-align: justify;
  border-radius: 8px;
  font-size: 2rem;
}
.item5 {
  padding: 1em;
  background-color: #ff020263;
  color: #03011F;
  text-align: justify;
  border-radius: 8px;
  font-size: 2rem;
}
.item6 {
  padding: 1em;
  background-color: #ff020263;
  color: #03011F;
  text-align: justify;
  border-radius: 8px;
  font-size: 2rem;
}
.imgscroll{
  height: 50px;
}
.center {
  height: 150px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: auto;
}
.zoom {
  padding: 50px;
  transition: transform .2s; /* Animation */
  transform: scale(2.2);
  margin: 0 auto;
}

.zoom:hover {
  transform: scale(1.9); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}