@import url('https://fonts.googleapis.com/css?family=Open+Sans');

body 
{
	background-color: #000000FF;
	position: absolute;
	top: 0px;
	color: #DDD;
	font-family: "Open Sans", Tahoma, Arial, sans-serif;
	font-size: 14px;
	margin: 0px;
	width: 100%;
	height: 100%;
	overflow: auto;
}
table 
{
	font-size: 14px;
	border-collapse: collapse;
}
thead 
{
	background-color: #DDD;
}
tbody tr:nth-child(odd)
{
	background-color: #F3F3F3;
}
td 
{
	border: 1px solid #DDD;
	padding: 2px;
}
a 
{ 
	color: inherit; 
} 

.align-right 
{
	text-align: right;
}

.title 
{
    font-size: 48px;
    text-align: center;
}
.heading 
{
    font-size: 36px;
    text-align: center;
}
.subheading 
{
    font-size: 28px;
    text-align: center;
}
pre 
{
    margin: 6px;
    text-align: center;
}
.node 
{
	margin-left: 2px;
	padding: 10px;
    margin-bottom: 0px;
    text-align: center;
}
.row
{
	display: flex;
  	flex-direction:row;
}
.content
{
    z-index: 1;
    margin: auto;
	background-color: #3232328F;
}
.content2
{
    z-index: 1;
    margin: auto;
    background-color: #3232328F;
}
.content3
{
    z-index: 1;
    margin: auto;
    background-color: #3232328F;
}
.background 
{
	position:fixed;
    left:0px;
	top:0px;
	margin: 0px;
	padding: 0px;
    z-index:-1;	
}
@media screen and (orientation: landscape ) 
{
	.content
	{
		float: left;
		margin-top: 7.5%;
		margin-left: 2%;
		margin-right: 2%;
		width: 100%;
	}
	.content2
	{
		float: center;
		margin-top: 7.5%;
		margin-left: 2%;
		margin-right: 2%;
		width: 100%;
	}
	.content3
	{
		float: right;
		margin-top: 7.5%;
		margin-left: 2%;
		margin-right: 2%;
		width: 100%;
	}
    
}
@media screen and (orientation: portrait ) 
{	
	.row
	{
		display: flex;
		flex-direction:column;
	}
	.content
	{
        width: 80%;
		margin-top:0%;
	}
	.content2
	{
		width:80%;
		margin-top:5%;
	}
	.content3
	{
		width:80%;
		margin-top:5%;
		margin-bottom:5%;
	}
	.background
	{
		height: 100%;
		top: 112px;
	}
}