
section {
  margin-top: 30px;
}
.mtop-30 {
  margin-bottom: -30px;
}
.container-g {
  width: min(96%, 1300px);
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.box-pad10 {
  padding-left: 10px;
  padding-right: 10px;
}
.call {
  text-align: center;
  font-size: 28px;
}

@media (min-width: 360px) and (max-width: 679px) {
.parent-g {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(36, 1fr);
grid-column-gap: 0px;
grid-row-gap: 10px;
}
.div1 { grid-area: 1 / 1 / 2 / 2; }
.div2 { grid-area: 2 / 1 / 3 / 2; }
.div3 { grid-area: 3 / 1 / 4 / 2; }
.div4 { grid-area: 4 / 1 / 5 / 2; }
.div5 { grid-area: 5 / 1 / 6 / 2; }
.div6 { grid-area: 6 / 1 / 7 / 2; }
.div7 { grid-area: 7 / 1 / 8 / 2; }
.div8 { grid-area: 8 / 1 / 9 / 2; }
.div9 { grid-area: 9 / 1 / 10 / 2; }
.div10 { grid-area: 10 / 1 / 11 / 2; }
.div11 { grid-area: 11 / 1 / 12 / 2; }
.div12 { grid-area: 12 / 1 / 13 / 2; }
.div13 { grid-area: 13 / 1 / 14 / 2; }
.div14 { grid-area: 14 / 1 / 15 / 2; }
.div15 { grid-area: 15 / 1 / 16 / 2; }
.div16 { grid-area: 16 / 1 / 17 / 2; }
.div17 { grid-area: 17 / 1 / 18 / 2; }
.div18 { grid-area: 18 / 1 / 19 / 2; }
.div19 { grid-area: 19 / 1 / 20 / 2; }
.div20 { grid-area: 20 / 1 / 21 / 2; }
.div21 { grid-area: 21 / 1 / 22 / 2; }
.div22 { grid-area: 22 / 1 / 23 / 2; }
.div23 { grid-area: 23 / 1 / 24 / 2; }
.div24 { grid-area: 24 / 1 / 25 / 2; }
.div25 { grid-area: 25 / 1 / 26 / 2; }
.div26 { grid-area: 26 / 1 / 27 / 2; }
.div27 { grid-area: 27 / 1 / 28 / 2; }
.div28 { grid-area: 28 / 1 / 29 / 2; }
.div29 { grid-area: 29 / 1 / 30 / 2; }
.div30 { grid-area: 30 / 1 / 31 / 2; }
.div31 { grid-area: 31 / 1 / 32 / 2; }
.div32 { grid-area: 32 / 1 / 33 / 2; }
.div33 { grid-area: 33 / 1 / 34 / 2; }
.div34 { grid-area: 34 / 1 / 35 / 2; }
.div35 { grid-area: 35 / 1 / 36 / 2; }
.div36 { grid-area: 36 / 1 / 37 / 2; }

}


@media (min-width: 680px) and (max-width: 991px) {
.parent-g {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(18, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
}
.div1 { grid-area: 1 / 1 / 2 / 2; }
.div2 { grid-area: 1 / 2 / 2 / 3; }
.div3 { grid-area: 2 / 1 / 3 / 2; }
.div4 { grid-area: 2 / 2 / 3 / 3; }
.div5 { grid-area: 3 / 1 / 4 / 2; }
.div6 { grid-area: 3 / 2 / 4 / 3; }
.div7 { grid-area: 4 / 1 / 5 / 2; }
.div8 { grid-area: 4 / 2 / 5 / 3; }
.div9 { grid-area: 5 / 1 / 6 / 2; }
.div10 { grid-area: 5 / 2 / 6 / 3; }
.div11 { grid-area: 6 / 1 / 7 / 2; }
.div12 { grid-area: 6 / 2 / 7 / 3; }
.div13 { grid-area: 7 / 1 / 8 / 2; }
.div14 { grid-area: 7 / 2 / 8 / 3; }
.div15 { grid-area: 8 / 1 / 9 / 2; }
.div16 { grid-area: 8 / 2 / 9 / 3; }
.div17 { grid-area: 9 / 1 / 10 / 2; }
.div18 { grid-area: 9 / 2 / 10 / 3; }
.div19 { grid-area: 10 / 1 / 11 / 2; }
.div20 { grid-area: 10 / 2 / 11 / 3; }
.div21 { grid-area: 11 / 1 / 12 / 2; }
.div22 { grid-area: 11 / 2 / 12 / 3; }
.div23 { grid-area: 12 / 1 / 13 / 2; }
.div24 { grid-area: 12 / 2 / 13 / 3; }
.div25 { grid-area: 13 / 1 / 14 / 2; }
.div26 { grid-area: 13 / 2 / 14 / 3; }
.div27 { grid-area: 14 / 1 / 15 / 2; }
.div28 { grid-area: 14 / 2 / 15 / 3; }
.div29 { grid-area: 15 / 1 / 16 / 2; }
.div30 { grid-area: 15 / 2 / 16 / 3; }
.div31 { grid-area: 16 / 1 / 17 / 2; }
.div32 { grid-area: 16 / 2 / 17 / 3; }
.div33 { grid-area: 17 / 1 / 18 / 2; }
.div34 { grid-area: 17 / 2 / 18 / 3; }
.div35 { grid-area: 18 / 1 / 19 / 2; }
.div36 { grid-area: 18 / 2 / 19 / 3; }

}


@media (min-width: 992px) and (max-width: 1920px) {
.parent-g {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(12, 1fr);
grid-column-gap: 20px;
grid-row-gap: 20px;
}
.div1 { grid-area: 1 / 1 / 2 / 2; }
.div2 { grid-area: 1 / 2 / 2 / 3; }
.div3 { grid-area: 1 / 3 / 2 / 4; }
.div4 { grid-area: 2 / 1 / 3 / 2; }
.div5 { grid-area: 2 / 2 / 3 / 3; }
.div6 { grid-area: 2 / 3 / 3 / 4; }
.div7 { grid-area: 3 / 1 / 4 / 2; }
.div8 { grid-area: 3 / 2 / 4 / 3; }
.div9 { grid-area: 3 / 3 / 4 / 4; }
.div10 { grid-area: 4 / 1 / 5 / 2; }
.div11 { grid-area: 4 / 2 / 5 / 3; }
.div12 { grid-area: 4 / 3 / 5 / 4; }
.div13 { grid-area: 5 / 1 / 6 / 2; }
.div14 { grid-area: 5 / 2 / 6 / 3; }
.div15 { grid-area: 5 / 3 / 6 / 4; }
.div16 { grid-area: 6 / 1 / 7 / 2; }
.div17 { grid-area: 6 / 2 / 7 / 3; }
.div18 { grid-area: 6 / 3 / 7 / 4; }
.div19 { grid-area: 7 / 1 / 8 / 2; }
.div20 { grid-area: 7 / 2 / 8 / 3; }
.div21 { grid-area: 7 / 3 / 8 / 4; }
.div22 { grid-area: 8 / 1 / 9 / 2; }
.div23 { grid-area: 8 / 2 / 9 / 3; }
.div24 { grid-area: 8 / 3 / 9 / 4; }
.div25 { grid-area: 9 / 1 / 10 / 2; }
.div26 { grid-area: 9 / 2 / 10 / 3; }
.div27 { grid-area: 9 / 3 / 10 / 4; }
.div28 { grid-area: 10 / 1 / 11 / 2; }
.div29 { grid-area: 10 / 2 / 11 / 3; }
.div30 { grid-area: 10 / 3 / 11 / 4; }
.div31 { grid-area: 11 / 1 / 12 / 2; }
.div32 { grid-area: 11 / 2 / 12 / 3; }
.div33 { grid-area: 11 / 3 / 12 / 4; }
.div34 { grid-area: 12 / 1 / 13 / 2; }
.div35 { grid-area: 12 / 2 / 13 / 3; }
.div36 { grid-area: 12 / 3 / 13 / 4; }

section {
  margin-top: 60px;
}
}