*
{
  box-sizing: border-box; /* Used for responsive design */
}

html
{
	scroll-behavior: smooth;
}

body
{
	background-color: #121212;
	color: #f2f2f2;
	font-family: Helvetica, sans-serif;
	max-width: 100vw; /* vw: viewport width; expressed in % */
	margin: 0px;
}

img
{
	max-height: 65vh;
	max-width: 90vw;
}

li
{
	text-align: left;
	padding: 0.25em;
}

ol li
{
	padding: 1em;
}

h2
{
	border-color: #f2f2f2;
	border-style: dotted;
	border-bottom: 0px;
	border-left: 0px;
	border-right: 0px;
	padding-top: 1em;
}

a
{
	color: #f2f2f2
}

.main-list, .subtitle
{
	list-style-type: none; /* This allows me to align the beggining of the subtitle with the li tags */

	font-size: 1.17em;
	font-weight: bold;

	/* These are actually the default values for H3 in most browsers */
}

.main-list li
{
	text-align: center;
}

.main-list
{
	padding-left: 0px;
}

#Wrapper
{
	text-align: center;
	padding: 1em;
}

#Wrapper.landing-page
{
    position: fixed;
    left: 50%;
    top: 50%;
	transform: translate(-50%, -50%);

	border: solid #f2f2f2 1px;
}