/* Reset styles */

body {height: 100% !important;width:100% !important;margin: 0;padding: 0;font-size: 0;}
table {border-collapse: collapse;padding: 0;margin: 0;border: none;}
img, a img {border: 0;outline: none;text-decoration: none;}
h1, h2, h3, h4, h5, h6, p {margin: 0; padding: 0;}
figure, blockquote {margin-block-start: 0;margin-block-end: 0;margin-inline-start: 0;margin-inline-end: 0;unicode-bidi: isolate;}
ul {list-style: none;padding: 0;margin: 0; margin-block-start: 0;margin-block-end: 0;margin-inline-start: 0px;margin-inline-end: 0px;padding-inline-start: 0px;}
* {box-sizing: border-box;}

body {
	background-color: #043487;
}

.page-container {
	width: 100vw;
	margin: 0 auto;
	text-align: center;
	color: #f5f5f5;
	font-family: 'Cresta', 'Helvetica', 'Helvetica Neue', Arial, sans-serif;
	font-weight: normal;
	font-size: 16px;
	line-height: 1.5em;
	font-feature-settings: "liga" 1, "dlig" 1, "pnum" 1;
	/* -moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased; */
}

.full-width-container {
	/* width: calc((100vw / 14) * 12); */
	width: 100%;
	max-width: 1440px;
	margin: 0 auto;
}

.flex-container {
  display: flex;
  flex-direction: row;
}

.flex-item {
  background-color: #f1f1f1;
  padding: 10px;
  font-size: 13px;
  text-align: left;
  width: 100%;
  padding: 66px;
}

.intro,
.credits,
.cta {
	padding: 0 66px;
}

.two-columns {
	display: flex; /* Aligns child elements side-by-side */
	gap: 20px; /* Adds space between the columns */
}

.column-left,
.column-right {
    flex: 1; /* Makes both columns grow equally to fill the container width */
    padding: 0px;
}

.hide-mobile {
	display: auto;
}

.cta {
	margin: 72px 0;
}
.cta-or {
	display: auto;
	padding: 0 30px;
	font-size: 24px;
	font-weight: bold;
	font-style: italic;
}


button {
  background-color: #FF9DA0;
  border: none;
  color: #f5f5f5;
  padding: 14px 24px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
	font-family: 'Cresta', 'Helvetica', 'Helvetica Neue', Arial, sans-serif;
	font-weight: bold;
	font-size: 16px;
	line-height: 1.5em;
	min-width: 250px;
	border-radius: 8px;
	letter-spacing: 0.025em;
}

button:hover {
	background-color: #cc7e80;
}

button.secondary {
	background-color: #007852;
}

button.secondary:hover {
	background-color: #036a5d;
}

p a:hover, 
ul a:hover {
	opacity: 0.8;
}

h1,
h2 {
	font-family: 'Margo', TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;
	font-weight: normal;
	line-height: 1.090909em;
}

h1 {
	color: #FF9DA0;
	font-size: 110px;
	margin: 96px 0 40px;
}

h2 {
	font-style: italic;
	font-size: 3.25rem;
	letter-spacing: 0.025em;
	margin: 0 0 0.5em;
}

p {
	font-family: 'Cresta', 'Helvetica', 'Helvetica Neue', Arial, sans-serif;
	font-size: 1rem;
	line-height: 1.5em;
	margin-bottom: 1.5em;
}

.intro p {
	font-size: 1.5rem;
	line-height: 1.333333em;
	margin-bottom: 0;
}

.credits p {
	font-size: .75rem;
	line-height: 1.5em;
	color: #CBD3D7;
	margin-bottom: 72px;
}

ul {
	font-size: 1rem;
	list-style-type: disc;
	list-style-position: outside;
	line-height: 1.5em;
}

.flex-item p,
.flex-item ul {
	padding-left: 36px;
}

p strong,
p b,
ul strong,
ul b  {
	font-weight: bold;
	letter-spacing: 0.025em;
}

p em {
	font-style: italic;
}

p strong em,
p em strong {
	font-weight: bold;
	font-style: italic;
}


.box1 {
	background-color: #0275b7;
}

.box1 h2 {
	color: #e5bb01;
}

.box2 {
	background-color: #d29326;
}

.box2 h2 {
	color: #043487;
}

.box3 {
	background-color: #007852;
}

.box3 h2 {
	color: #e97f81;
}

.box4 {
	background-color: #E45400;
}

.box4 h2 {
	color: #cad3d8;
}

a {
	color: inherit;
	text-decoration: underline;
	opacity: 1;
}


/* Responsive styles */

@media screen and (max-width: 1119px) {
	h1 {
		font-size: 86px;
	}
	.intro p,
	.cta-or {
		font-size: 19px;
	}
}

@media screen and (max-width: 1023px) {
	.flex-container {
    flex-direction: column;
    padding: 0 48px;
  }
  .flex-item {
  	padding: 48px;
  }
  .intro,
  .cta {
  	padding: 0 48px;
  }
  .two-columns {
  	flex-direction: column;
  }
	.hide-mobile {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	.flex-container {
		padding: 0;
	}
	.flex-item {
  	padding: 36px;
  }
  .intro,
  .credits,
  .cta {
  	padding: 0 36px;
  }
	h1 {
		font-size: 58px;
		margin: 72px 0 30px
	}
	h2 {
		font-size: 40px;
	}
	.cta {
		margin: 54px 0;
	}
	.cta-or {
		display: none;
		padding: 0;
	}
	button {
		width: 100%;
		margin-bottom: 16px;
	}
	.credits p {
		margin-bottom: 54px;
	}
}

@media screen and (max-width: 640px) {
	.flex-item {
  	padding: 36px 24px;
  }
  .intro,
  .credits,
  .cta {
  	padding: 0 24px;
  }
  .flex-item p {
  	padding-left: 24px;
  }
}