@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:regular,bold,italic&subset=latin,latin-ext');

:root {
  --primary: #509be1;
  --primary-text: #d3e9ff;
  --secondary: #ffd5d5;
  --secondary-text: #ffa0ad;
  --accent: #505050;
  --accent-text: #ffffff;

  --dark-gray: #464646;
  --light-gray: #616161;

  --bg-gray: #353C58;
  --button-blue: #76EECA;
  --button-dark-blue: #3D6C7C;

  /* --bg: #0B0C10;
  --window: #1F2833;
  --accent: #C5C6C7;
  --accent2: #66FCF1;
  --accent3: #45A29E; */

  --bg: #050505;
  --window: #0B3C5D;
  --accent: #D9B310;
  --accent2: #FFFFFF;
  --accent3: #328CC1;

  --red: #C83C4A;
  --maroon: #4d1a09;
  --yellow: #e2c042;
  --light-brown: #a59a84;
  --brown: #4f442b;
  --black: #000000;
  --white: #FFFFFF;
  --cream: #FFEFCB;

  --gray: #313136;
  --dark-gray: #212226;
  --pink: #FE3070;
  --off-white: #D7D7D7;
  --green: #00FF33;
  --purple: #9E5BFF;
  --blue: #0089FD;
}

form {
	display: flex;
	flex-direction: column;
	width: 200px;
	margin: 20px;
}

form input {
	width: 100%;
	padding: 16px;
	background-color: var(--bg);
  color: var(--accent);
	margin-bottom: 16px;
	font-size: 14px;
	border: 2px solid var(--accent2);
  border-radius: 6px;
	box-sizing: border-box;
  text-align: center;
  font-family: "coder";
}

form textarea {
	width: 100%;
	padding: 16px;
	background-color: #edf2f7;
	border: none;
	margin-bottom: 16px;
	font-size: 14px;
	border: 2px solid #a0aec0;
	box-sizing: border-box;
	height: 150px;
}

form button[type="submit"] {
	background-color: #48bb78;
	color: #ffffff;
	font-size: 14px;
	border: none;
	padding: 16px;
	width: 100%;
}