@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300&display=swap');

* {
	box-sizing: border-box;
}

body {
	margin: 0;
	padding: 10px;
	padding-top:30px;
	height: max-content;	
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;	
	text-align: center;	
	font-family: Montserrat, Raleway, Roboto, Arial, Helvetica, sans-serif;
	background-color: #202A44;
	align-self: flex-start;
	
}

h3 {
	color: white;	
	margin: 0;
	font-size: 44px;
	text-shadow: .5px .5px 2px grey;
	letter-spacing: 3px;
}

#tagline {
	font-size: 28px;
	letter-spacing: 1px;
	
}

textarea {
	border: 0;
	border-radius: 10px;
	width: 100%;
	display: block;
	font-family: inherit;
	padding: 10px;
	margin: 0 0 20px;
	height: 80px;
	font-size: 16px;
	outline: none;
}

.container {
	width: 500px;	
	max-width: 100%;
}

ol {
	font-size: 22px;
	color: #fff;
	margin: 20px 60px 20px 0;
	text-shadow: .5px .5px 4px grey;	
	letter-spacing: .5px;
	list-style: none;
}

#tags {
	width: 50vw;
	display: inline-block;	
}

.tag {
	background-color: #FF7D45;
	color: #fff;
	padding: 5px 15px;
	margin: 4px 4px;
	border-radius: 10px;
	display: inline-block;
	cursor: pointer;
}

.tag.highlight {
	background-color: #008F89;
	transform: scale(1.2,1.2);
}

.article {
	color:white;
	text-align:left;
	padding: 5% 15% 0;
}

a {
	color:yellow;
}