body {
	background-color: #F8F9FA;
	font-family: 'bariolregular';
	margin: 0px;
	padding: 0px;
}

h2 {
	font-size: 80px;
	margin-top: 0;
	margin-bottom: 24px;
	color: #415A77;
}

.backgroundFade {
	background-image: linear-gradient(to bottom, #A9B7C8, #F8F9FA);
}

.mainTitleDiv {
	padding-top: 64px;
	padding-bottom: 64px;
	padding-left: 64px;
	padding-right: 64px;
	position: relative;
}

.sectionContainer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: flex-start;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	text-align: center;
}

.titleText {
	flex: 1;
	min-width: 430px;
	box-sizing: border-box;
	width: 30%;
	margin-bottom: 0px;
}

.titlePicture {
	flex: 1;
	min-width: 1000px;
	box-sizing: border-box;
	width: 70%;
	margin-bottom: 0px;
}

.brownText {
	color: #B85233;
}

.greenText {
	color: #6C756B;
}

.underTitle {
	color: #1B263B;
	font-size: 20px;
}

.promptTitle {
	color: #415A77;
	font-size: 80px;
	width: 100%;
	text-align: center;
}

.footer {
	color: #415A77;
	text-align: center;
	font-size: 16px;
}

.formContainer {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	transition: width 0.6s, height 0.6s, paddingTop 0.6s, paddingBottom 0.6s;
	gap: 40px;
	margin: 0 auto;
	overflow: hidden;
	padding-top: 50px;
	padding-bottom: 50px;
	padding-left: 70px;
	padding-right: 70px;
}

.uploadImageSlot {
	display: flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	border: 3px dashed #E0A458;
	border-radius: 10px;
	background: #1B263B;
	cursor: pointer;
	transition: all 0.3s;
	color: #F8F9FA;
	font-size: 20px;
	min-height: 500px;
	width: 350px;
}

.uploadImageSlot:hover {
	border-color: #E0A458;
	background: #415A77;
	transform: translateY(-5px);
	box-shadow: 10px 10px 10px #1B263B26;
}

.uploadImageSlotDragOver {
	border-color: #E0A458;
	background: #415A77;
	transform: translateY(-5px);
	box-shadow: 0 10px 40px #1B263B26;
}

.uploadImageSlotLabel {
	display: flex;
	width: 100%;
	height: 100%;
	cursor: pointer;
	align-items: center;
	text-align: center;
	justify-content: center;
}

.cardScreenContainer {
	color: #F8F9FA;
	border: 1px solid #E0A458;
	border-radius: 10px;
	background: #415A77;
	transition: all 0.3s;
	width: 330px;
	padding: 0px;
}

.paddedContainer {
	padding: 10px 10px 10px 10px;
}

.paddedFieldContainer {
	width: 100%;
	padding-top:10px;
	font-size: 15px;
}

.padBottom {
	padding-bottom:10px;
}

.paddedFieldLabel {
	padding-bottom: 4px;
}

.paddedFieldTitle {
	font-size: 32px;
}

.confirmedEmailMessage {
	color: #80FF80;
}

.displayedField {
	background: #415A77;
	color: #F8F9FA;
	border: 1px solid #1B263B;
	width: 100%;
	border-radius: 10px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.actionButtonNarrow {
	width: 30% !important;
}

.actionButtonNarrowSmall {
	width: 15% !important;
}

.actionButton {
	width: 100%;
	text-align: center;
	background: #F8F9FA;
	color: #415A77;
	font-size: 16px;
	font-family: inherit;
	font-weight: inherit;
	border: 1px solid #1B263B;
	border-radius: 100px;
	padding: 10px;
	cursor: pointer;
	transition: box-shadow 0.15s, border 0.15s, font-weight 0.15s;
}

.actionButton:hover {
	box-shadow: 0px 0px 0px 2px #E0A458FF;
	border: 1px solid #E0A458;
	font-weight: 700;
}

.actionButton:focus {
	box-shadow: 0px 0px 0px 2px #E0A458FF;
	border: 1px solid #E0A458;
	font-weight: 700;
}

.actionButton:active {
	transform: scale(0.96);
}

.actionButton:disabled {
	color:#ADB5BD;
	cursor:default;
}

.actionButton:disabled:hover {
	box-shadow: 0px 0px 0px 0px #E0A45860;
	border: 1px solid #1B263B;
	font-weight: inherit;
}

.actionButton:disabled:active {
	transform: scale(1);
}

.textField {
	background-color: #415A77;
	border-radius: 10px;
	border: 1px solid #1B263B;
	color: #F8F9FA;
	width: 100%;
	font-family: inherit;
	font-size: 15px;
	line-height: 41.5px;
	padding: 0px 15px;
	box-sizing: border-box;
}

.textField:focus {
	outline: none;
	box-shadow: 0px 0px 0px 2px #E0A45860;
	border: 1px solid #E0A458;
}

.textField:hover {
	outline: none;
	box-shadow: 0px 0px 0px 2px #E0A45860;
	border: 1px solid #E0A458;
}

.createdPictureContainer {
	width:100%;
	margin: auto;
	text-align: center;
}

.createdPictureImage {
	box-shadow: 10px 10px 10px #1B263B70;
	border: 1px solid #E0A458;
}

.bottomButtonsPadding {
	padding: 20px 20px 0px 20px;
	text-align: center;
}

.bottomButtonsPaddingAll {
	padding: 20px 20px 20px 20px;
	text-align: center;
}

.messageButton {
	background: #080808;
	color: #D1D5DB;
	padding: 12px 24px;
	border: 1px solid #D1D5DB;
	border-radius: 100px;
	font-weight: 700;
	cursor: pointer;
	font-family: 'bariolregular';
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	transition: all 0.2s;
	font-size: 20px;
}

.messageButton:hover {
	box-shadow: 0 0 15px #1B263B60;
}

.messageButton:active {
	transform: scale(0.96);
}

.giftCardWrapper {
	margin: auto;
	aspect-ratio: 1016/635;
	width: 100%;
	max-width: 900px;
	color: #503000;
	background-image: url('/images/GiftCard.png');
	background-size: 100% auto; /* width - height */
	background-repeat: no-repeat;
	background-position: left top;
	position: relative;
	container-type: inline-size;
}

.giftCardCode {
	font-family: "Courier New", ui-monospace, Consolas, Monaco, "Andale Mono", "Lucida Console", monospace;
	font-weight: bold;
	position: absolute;
	left: 28.5%;
	top: 54%;
	white-space: nowrap;
	font-size: 3cqw;
}

.hyperLink {
	color: #FF8080;
}
.legalCheckBox {
}