html
{
  	scrollbar-width: thin;			
}

body 
{
	display: flex;
	flex-direction: column;
	margin: auto;
	background-color: rgb(29, 31, 33);
	font-family: "Jost", sans-serif;
	font-optical-sizing: auto;
	font-weight:300;
	font-style: normal;
	min-height: 100vh;
	width: 80vw;
	max-width: 640px;
	overflow: visible;
}

a
{
	text-decoration: none;
	color: rgb(43, 188, 138);
}

strong
{
	text-decoration: none;
	color: rgb(215, 207, 192);
	font-weight: 600;
}

p
{
	color: rgb(230, 230, 230);
	font-size: 1.1em;
	text-align: justify;
	vertical-align: baseline;
	margin: 0em;
	margin-top: 0.3em;
	line-height: 1.3em;
}

ul
{
	list-style-type: none;
	margin-top: 2em;
	margin-bottom: 2em;
	padding-left: 1em;
}

li
{
	color: rgb(230, 230, 230);
	font-size: 1.1em;
	text-align: justify;
	vertical-align: baseline;
	margin: 0em;
	margin-top: 0.3em;
	line-height: 1.3em;
}

li.newLine
{
	color: rgb(230, 230, 230);
	font-size: 1.1em;
	text-align: justify;
	vertical-align: baseline;
	margin: 0em;
	margin-top: 0.3em;
	margin-bottom: 1.3em;
	line-height: 1.3em;
}

@media screen and (max-width: 640px) 
{
    p {
		color: rgb(230, 230, 230);
		font-size: 1.1em;
		text-align: start;
		vertical-align: baseline;
		margin: 0em;
		margin-top: 0.3em;
		line-height: 1.3em;
    }
    
    li
	{
		color: rgb(230, 230, 230);
		font-size: 1.1em;
		text-align: start;
		vertical-align: baseline;
		margin: 0em;
		margin-top: 0.3em;
		line-height: 1.3em;
	}
	
	li.newLine
	{
		color: rgb(230, 230, 230);
		font-size: 1.1em;
		text-align: start;
		vertical-align: baseline;
		margin: 0em;
		margin-top: 0.3em;
		margin-bottom: 1.3em;
		line-height: 1.3em;
	}
}

br
{
	margin: 0.2em;
}

h1, h2, .title
{
	color: rgb(228, 139, 73);
	font-size: 1.5em;
	margin-top: 1.5em;		
	margin-bottom: 1em;
	font-weight: bold;
}

h3, .subtitle
{
	color: rgb(209, 197, 188);
	font-size: 1.4em;
	font-style: italic;
	text-decoration: none;
	font-weight: bold;
}

figure 
{
  display: flex;
  flex-flow: column;
  padding: 0px;
  max-width: 100%;
  margin: auto;
}

figcaption 
{
  color: rgb(175, 175, 175);
  font: italic smaller sans-serif;
  padding: 3px;
  text-align: center;
  text-decoration: none;
  font-size: 1em;
  margin-bottom: 3%;
}

img
{
	max-width: 100%;
	height: auto;
	margin-top: 3%;
	margin-bottom: 3%;
	margin-left: auto;
	margin-right: auto;
	border-radius: 10px;
	border: medium solid rgb(70, 70, 70);
}

.italic
{
  	font-style: italic;	
}

.bold
{
	text-decoration: none;
	color: rgb(43, 188, 138);
	font-weight: 600;
}

.bold-strong
{
	text-decoration: none;
	color: rgb(215, 207, 192);
	font-weight: 600;
}

.bold-red
{
	text-decoration: none;
	color: rgb(215, 207, 192);
	font-weight: 600;
}

.bold-white
{
	text-decoration: none;
	color: rgb(230, 230, 230);
	font-weight: 600;
}

.gray
{
	margin-right: 0.5em;
	text-decoration: none;
	color: rgb(175, 175, 175);
	text-decoration: none;
	font-weight: bold;
}

.underline
{
	text-decoration: underline;
}

.bold-orange
{
	text-decoration: none;
	color: rgb(255, 165, 0);
	font-weight: bold;
}

details 
{
	margin-top: 0;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: auto;	
}

details > summary 
{
	color: rgb(219, 208, 208);
	font-weight: bold;
	font-size: 1.1em;
	margin-top: 3%;
	margin-bottom: 3%;
	cursor: pointer;
}
