@font-face {
	font-family   : "Roboto Regular";
	src           : url("https://fonts.gstatic.com/s/roboto/v48/KFO7CnqEu92Fr1ME7kSn66aGLdTylUAMa3yUBHMdazQ.woff2") format("woff2");
	font-style    : normal;
	font-weight   : 300;
	font-stretch  : 100%;
	unicode-range : U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family   : "Roboto Slab";
	src           : url("https://fonts.gstatic.com/s/robotoslab/v35/BngMUXZYTXPIvIBgJJSb6ufN5qWr4xCC.woff2") format("woff2");
	font-style    : normal;
	font-weight   : 400;
	unicode-range : U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@keyframes button-pulse {
	0% {box-shadow : 0 0 0 0 rgba(239, 74, 102, 1)}
	70%, to {box-shadow : 0 0 0 10px rgba(239, 74, 102, 0)}
}

body,
body[class*="page"] {
	background-color : hsla(217.43, 100%, 19.8%, 1);
	color            : white;
	font-family      : "Roboto Regular", sans-serif;
	font-size        : 20px;
	margin           : 0;
	padding          : 0;
	text-align       : center;
}

h1, h2, h3 {
	font-family : "Roboto Slab", serif;
	font-size   : 2.3rem;
	font-weight : 400;
}

/* form fields */
body input[type="text"],
body input[type="password"],
body input[type="email"],
body input[type="text"]:not(.loginTextFields),
body input[type="datetime-local"],
body select {
	appearance  : none;
	background  : white;
	border      : 1px solid rgba(0, 0, 0, .12);
	color       : black;
	font        : normal 1.3rem/1 "Roboto Regular", sans-serif;
	height      : 3.5rem;
	line-height : 1.2rem;
	padding     : 1.4rem 2rem;
	transition  : background .3s ease-out, border .3s ease-out;
	width       : 100%;
}

body input[type="text"]:focus,
body input[type="password"]:focus,
body input[type="email"]:focus,
body input[type="text"]:not(.loginTextFields):focus,
body input[type="datetime-local"]:focus,
body select:focus {
	outline-color  : white;
	outline-offset : 2px !important;
	outline-style  : solid;
	outline-width  : 2px;
}

@media screen and (max-width : 767px) and (orientation : portrait) {
	body input[type="text"],
	body input[type="password"],
	body input[type="email"],
	body input[type="text"]:not(.loginTextFields),
	body input[type="datetime-local"],
	body select {
		font-size : 1.3rem;
	}
}

/* form button */
button,
body .tsFormFooterButtons input[type="button"] {
	animation      : button-pulse 2s infinite;
	background     : rgb(239, 74, 102);
	border         : 0;
	border-radius  : 2rem;
	color          : white;
	font-size      : 1rem;
	font-weight    : bold;
	height         : 3.5rem;
	margin         : 0;
	overflow       : hidden;
	position       : relative;
	transition     : 300ms;
	vertical-align : top;
	width          : 11rem;
	z-index        : 1;
}

button:hover,
body .tsFormFooterButtons input[type="button"]:hover {
	background : white;
	color      : rgb(239, 74, 102);
	opacity    : 1;
}

/*
button::before,
body .tsFormFooterButtons input[type="button"]::before {
	background-color : white;
	border           : 0;
	content          : "Sign me up";
	height           : 101%;
	left             : 0;
	position         : absolute;
	top              : 0;
	transform        : scaleY(0);
	transform-origin : bottom;
	transition       : transform 300ms;
	width            : 101%;
	z-index          : -1;
}

button:hover::before,
body .tsFormFooterButtons input[type="button"]:hover::before {
	transform        : scaleY(1);
	transform-origin : top;
}

button::after,
body .tsFormFooterButtons input[type="button"]::after {
	background : rgb(239, 74, 102);
	content    : "";
	height     : 100%;
	left       : 0;
	position   : absolute;
	top        : 0;
	width      : 100%;
	z-index    : -2;
}
*/

#BrandingCEDiv,
#aspnetForm .ce-legend,
body .ce-label,
#aspnetForm .ce-fieldset:has(.tsCheckBoxLists.EmailOptInList_System.Lists),
span[style="visibility:hidden;"] {
	display : none;
}

body #tsPageMainFormContent {
	display               : grid;
	float                 : none;
	gap                   : 1rem;
	grid-template-columns : 1fr;
	margin                : 0 auto;
	max-width             : 80rem;
}

#tsPageMainFormContent > fieldset {
	display               : grid;
	gap                   : 1rem;
	grid-template-columns : 1fr;
}

@media screen and (min-width : 767px) {
	body #tsPageMainFormContent {
		grid-template-columns : 1fr fit-content(200px);
	}

	#tsPageMainFormContent > fieldset {
		grid-template-columns : repeat(3, 1fr);
	}
}

body #aspnetForm .ce-fieldset {
	float   : none;
	margin  : 0;
	padding : 0;
}

body #aspnetForm .tsFormRows.half.first,
body #aspnetForm .tsFormRows.half.last {
	float  : none;
	margin : 0;
	width  : unset;
}

.footer {
	font-size : 1rem;
}

#tsReceiptPageHeader {
	padding : 2rem;
}