@charset "utf-8";
/* CSS Document */




/* Solutions Section */

.s1_grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 50px 50px;
  margin:10rem 0;
  grid-template-areas:
    "s1_num s1_r1_copy s1_r1_copy"
    "s1_r2_image s1_r2_image s1_r2_image"
    "s1_r3_image s1_r3_copy ."
    "s1_r4_copy s1_r4_image s1_r4_image"
    "s1_r5_image s1_r5_copy ."
    "s1_r6_copy s1_r6_image s1_r6_image";
}
@media only screen and (max-width: 720px) {
	.s1_grid {
  grid-template-areas:
	"s1_num s1_num s1_num"
    "s1_r1_copy s1_r1_copy s1_r1_copy"
    "s1_r2_image s1_r2_image s1_r2_image"
	  "s1_r3_image s1_r3_image ."
    "s1_r3_copy s1_r3_copy s1_r3_copy"
    "s1_r4_image s1_r4_image s1_r4_image"
	  "s1_r4_copy s1_r4_copy s1_r4_copy"
    "s1_r5_image s1_r5_copy ."
    "s1_r6_copy s1_r6_image s1_r6_image";
}
}

.s1_num { grid-area: s1_num; align-self: end; }
.s1_r1_copy { grid-area: s1_r1_copy; align-self: start;}
.s1_r2_image { grid-area: s1_r2_image; }
.s1_r3_image { grid-area: s1_r3_image; margin: 5rem 0 0 0;}
.s1_r3_copy { grid-area: s1_r3_copy; margin: 5rem 0 0 0;}
.s1_r4_copy { grid-area: s1_r4_copy; align-self: end;}
.s1_r4_image { grid-area: s1_r4_image; }
.s1_r5_copy { grid-area: s1_r5_copy; }
.s1_r6_copy { grid-area: s1_r6_copy;}
.s1_r6_image { grid-area: s1_r6_image; }

@media only screen and (max-width: 720px) {
	.s1_r3_image { grid-area: s1_r3_image; margin: 1rem 0 0 0;}
	.s1_r3_copy { grid-area: s1_r3_copy; margin: 1rem 0 2rem 0;}
}


.s2_grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 50px 50px;
	margin:10rem 0;
  grid-template-areas:
    "s2_num s2_r1_copy s2_r1_copy"
    "s2_r2_image s2_r2_image2 s2_r2_image2"
	"s2_r3_image s2_r3_image s2_r3_copy" ;
}
@media only screen and (max-width: 720px) {
	.s2_grid {
		grid-template-areas:
		"s2_num s2_num s2_num"
		"s2_r1_copy s2_r1_copy s2_r1_copy"
		"s2_r2_image s2_r2_image s2_r2_image2"
		/* "s2_r2_image2 s2_r2_image2 s2_r2_image2" */
		"s2_r3_image s2_r3_image s2_r3_image" 
		"s2_r3_copy s2_r3_copy s2_r3_copy";
	}
}

.s2_num { grid-area: s2_num; align-self:end;}
.s2_r1_copy { grid-area: s2_r1_copy; align-self:start;}
.s2_r2_image { grid-area: s2_r2_image; }
.s2_r2_image2 { grid-area: s2_r2_image2; }
.s2_r3_copy { grid-area: s2_r3_copy; }
.s2_r3_image { grid-area: s2_r3_image; }


.s3_grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 50px 50px;
	margin:10rem 0;
  grid-template-areas:
    "s3_num s3_r1_copy s3_r1_copy"
    "s3_r2_image s3_r2_image s3_r2_copy";
}
@media only screen and (max-width: 720px) {
	.s3_grid {
	  grid-template-areas:
		"s3_num s3_num s3_num"
		"s3_r1_copy s3_r1_copy s3_r1_copy"
		"s3_r2_image s3_r2_image s3_r2_copy";
	}
}

.s3_num { grid-area: s3_num; align-self:end;}
.s3_r1_copy { grid-area: s3_r1_copy; align-self:end;}
.s3_r2_image { grid-area: s3_r2_image; }
.s3_r2_copy { grid-area: s3_r2_copy; align-self: end;}



.s4_grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 50px 50px;
	margin:10rem 0 0 0;
  grid-template-areas:
    "s4_num s4_r1_copy s4_r1_copy"
    "s4_r2_image s4_r2_image s4_r2_image"
	  "s4_r3_copy s4_r3_copy .";
}

@media only screen and (max-width: 720px) {
	.s4_grid {
	  grid-template-areas:
		"s4_num s4_num s4_num"
		"s4_r1_copy s4_r1_copy s4_r1_copy"
		"s4_r2_image s4_r2_image s4_r2_image";
	}
}

.s4_num { grid-area: s4_num; align-self:end;}
.s4_r1_copy { grid-area: s4_r1_copy; align-self:end;}
.s4_r2_image { grid-area: s4_r2_image; }
.s4_r3_copy {grid-area: s4_r3_copy; }




.outcomes_grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto;
  gap: 50px 50px;
	margin:5rem 0;
  grid-template-areas:
    "outcomes_r1_copy outcomes_r1_copy outcomes_r1_copy"
	  "outcomes_r2_image outcomes_r2_image outcomes_r2_copy"
	  "outcomes_r3_copy . ."
	  "outcomes_r4_image outcomes_r4_image outcomes_r4_image"
    ". outcomes_r5_copy outcomes_r5_copy";
}

.outcomes_r1_copy {grid-area: outcomes_r1_copy ;}
.outcomes_r2_image {grid-area: outcomes_r2_image ;}
.outcomes_r2_copy {grid-area: outcomes_r2_copy; align-self:end;}
.outcomes_r3_copy {grid-area: outcomes_r3_copy ;}
.outcomes_r4_image {grid-area: outcomes_r4_image ;}
.outcomes_r5_copy {grid-area: outcomes_r5_copy ;}


@media only screen and (max-width: 720px) { .s1_grid, .s2_grid, .s3_grid, .s4_grid, .outcomes_grid { gap:25px 25px; margin:3rem 0; }