* {
    box-sizing: border-box;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.8;
	background: #9AD0C2;
	color: #265073;
	font-family: "Open Sans", sans-serif;
	font-optical-sizing: auto;
	font-weight: <weight>;
	font-style: normal;
	font-variation-settings: "wdth" 100;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='1920' height='1080' preserveAspectRatio='none' viewBox='0 0 1920 1080'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1025%26quot%3b)' fill='none'%3e%3crect width='1920' height='1080' x='0' y='0' fill='rgba(154%2c 208%2c 194%2c 1)'%3e%3c/rect%3e%3cpath d='M0%2c598.938C110.2%2c591.454%2c187.974%2c496.24%2c285.039%2c443.529C391.802%2c385.552%2c545.483%2c382.617%2c599.099%2c273.599C652.573%2c164.868%2c566.026%2c40.802%2c541.455%2c-77.85C518.628%2c-188.082%2c530.895%2c-311.146%2c459.914%2c-398.518C388.25%2c-486.732%2c270.82%2c-519.26%2c160.536%2c-546.735C53.851%2c-573.313%2c-61.884%2c-597.804%2c-162.549%2c-553.593C-259.72%2c-510.916%2c-298.218%2c-398.743%2c-364.731%2c-316.041C-428.316%2c-236.981%2c-525.973%2c-178.026%2c-544.785%2c-78.328C-563.794%2c22.413%2c-503.729%2c117.408%2c-464.382%2c212.076C-423.617%2c310.155%2c-392.663%2c416.032%2c-311.057%2c484.015C-224.374%2c556.228%2c-112.562%2c606.583%2c0%2c598.938' fill='%237cc2b0'%3e%3c/path%3e%3cpath d='M1920 1593.501C2035.246 1614.267 2152.47 1651.6509999999998 2263.546 1614.569 2388.638 1572.807 2503.965 1491.0529999999999 2569.562 1376.645 2637.732 1257.749 2669.469 1108.911 2628.447 978.141 2588.9719999999998 852.3009999999999 2454.735 790.0219999999999 2357.568 700.845 2272.575 622.841 2204.401 520.88 2093.946 487.59299999999996 1983.174 454.211 1866.869 488.452 1755.384 519.371 1642.374 550.713 1536.278 595.0609999999999 1444.2640000000001 667.773 1336.441 752.9780000000001 1177.762 836.275 1180.482 973.673 1183.318 1116.919 1361.856 1184.158 1456.614 1291.621 1520.843 1364.462 1566.393 1450.599 1647.763 1503.609 1729.49 1556.851 1824.006 1576.204 1920 1593.501' fill='%23b8ded4'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1025'%3e%3crect width='1920' height='1080' fill='white'%3e%3c/rect%3e%3c/mask%3e%3c/defs%3e%3c/svg%3e");
	background-size: cover;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

main .container {
	display: flex;
	align-items: center;
	justify-content: center;
	
	min-height: 100vh;
	width: 100%;
}

main .container .content {
	max-width: 700px;
	padding: 20px;
}

h1 {
	font-size: clamp(1.25rem, 0.4688rem + 2.5vw, 1.875rem);
	margin-bottom: 1.2em;
	font-weight: 800;
	color: #0b2c48;
}

h2 {
	font-size: clamp(1.125rem, 0.5781rem + 1.75vw, 1.5625rem);
	margin-bottom: 1.2em;
	font-weight: 700;
}

p {
	font-size: clamp(1rem, 0.8438rem + 0.5vw, 1.125rem);
	margin-bottom: 1.2em;
	font-weight: 600;
}

.button {
	display: block;
	outline: none;
	cursor: pointer;
	font-size: 1rem;
	line-height: 20px;
	font-weight: 600;
	border-radius: 8px;
	padding: 14px 24px;
	border: none;
	transition: box-shadow 0.2s ease 0s, -ms-transform 0.1s ease 0s, -webkit-transform 0.1s ease 0s, transform 0.1s ease 0s;
	background: linear-gradient(to right, rgb(230, 30, 77) 0%, rgb(227, 28, 95) 50%, rgb(215, 4, 102) 100%);
	color: #fff;
	text-decoration: none;
	text-align: center;
	max-width: 100%;
}

main .container .content .join-button {
	width: 100%;
	margin-top: 2rem;
}
