Initial commit

style.css

@@ -0,0 +1,119 @@
+@import url('https://fonts.googleapis.com/css2?family=Epilogue&family=Secular+One&display=swap');
+html,body{
+	width: 100%;
+	min-height: 100vh;
+	margin: 0;
+	padding: 0;
+}
+body{
+	position: absolute;
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	background-image: url(bg.webp);
+	background-size: cover;
+}
+header{
+	margin: 0;
+	margin-top: 2vw;
+	padding: 0;
+	text-align: center;
+}
+h1{
+	margin: 0;
+	padding: 0;
+	color: white;
+	font-family: Epilogue;
+	font-size: 14vw;
+	text-shadow: 0 0 1vw black;
+	cursor: default;
+}
+main{
+	display: none;
+	margin-bottom: 2vw;
+	background-color: #fff8;
+	box-shadow: 0 0 .5vw black;
+	border-radius: 1.5vw;
+	min-height: 9vw;
+	transition: .3s;
+	overflow: hidden;
+}
+main:hover{
+	background-color: #fff;
+	box-shadow: 0 0 1vw black;
+}
+h2{
+	margin: 0;
+	padding: 0 2vw;
+	height: 9vw;
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	align-items: center;
+	background-color: hsla(270,80%,80%,.6);
+	border-bottom: 0;
+	font-family: Secular One;
+	font-size: 3vw;
+	text-shadow: 2.5px 2px .5px white;
+	cursor: pointer;
+}
+form{
+	display: flex;
+	flex-direction: column;
+	justify-content: center;
+	display: none;
+	margin: 0;
+	padding: 2vw 2vw;
+	box-sizing: border-box;
+}
+.wrap{
+	display: none;
+	position: absolute;
+	left: 0;
+	right: 0;
+	top: 0;
+	bottom: 0;
+	background: #0008;
+	justify-content: center;
+	align-items: center;
+	z-index: 10;
+}
+.process,.complete,.error{
+	display: none;
+	padding: 2vw 5vw;
+	background-color: white;
+	box-shadow: 0 0 2vw black;
+	border-radius: 1.5vw;
+	font-size: 5vw;
+	cursor: default;
+}
+.process img{
+	width: 15vw;
+}
+h3{
+	margin: 0;
+	margin-top: .5vw;
+	font-family: Secular One;
+	font-size: 3vw;
+}
+.status{
+	margin: 0;
+	margin-top: .5vw;
+	font-family: monospace;
+	font-size: 1.5vw;
+}
+.btncont{
+	margin: 0;
+	padding: 0;
+}
+.btncont *{
+	font-size: 2vw;
+}
+#dlink{
+	margin-right: 1vw;
+}