body {

    background-color: black;
	
}

#background {
	
	background-image: url("../images/p5.jpg");
	width: 1024px;
    height: 768px;
    background-size: 100% 100%;
    max-width: 100%;
    max-height: 100%;
    background-repeat: no-repeat;
	
}

#datagrid {
	
	float:left;
	width: 100%;
    height: 100%;
	background-color:white;
	opacity: .80;
    filter: alpha(opacity=80); /* For IE8 and earlier */
	min-height:100%;
   position:relative;
}

header{

	text-align:center;
	 
	padding: 4px;
	
 }
 
nav{ 

	text-align:center;	
	padding: 4px;
	float:left;
	width:150px;
	height:70%;
	
 }

#info{ 

	color:blue;
	
	padding: 4px;
	height:70%;
	width:20%
	float:left;

	
	
}
 
#footer{ 

	text-align:center;
	padding: 4px;
		 
	position:absolute;
	bottom:0;
	width:98.5%;
    height:60px;   /* Height of the footer */
	
	 
 }
 
h1 {
    color: brown;
}

h3 {
	color: red;
}

a:link    {color:black; background-color:transparent; text-decoration:none}
a:visited {color:red; background-color:transparent; text-decoration:none}
a:hover   {color:blue; background-color:transparent; text-decoration:underline}
a:active  {color:yellow; background-color:transparent; text-decoration:underline

 @media screen and (min-width: 320px) {
  
  #background {
	display:none;
	}
	
	#datagrid {
	
	}

	header{

	 text-align:right;	
	}
	
	nav{ 

	 text-align:left;	
	}
	
	#info{ 

	color:black;
	text-align:right;
	}
	
	#footer{ 

	text-align:left;	 
	position:absolute;
	bottom:0;
    height:60px;   
	}
}

 @media screen and (min-width: 480px) {
 #background {
	display:none;
	}
	
	#datagrid {
	
	}

	header{

	 text-align:right;	
	}
	
	nav{ 

	 text-align:left;	
	}
	
	#info{ 

	color:black;
	text-align:right;
	}
	
	#footer{ 

	text-align:left;	 
	position:absolute;
	bottom:0;
    height:60px;   
	}
 
}

@media screen and (min-width: 600px) {
	
  #background {
	display:none;
	}
	
	#datagrid {
	
	}

	header{

	 text-align:right;	
	}
	
	nav{ 

	 text-align:left;	
	}
	
	#info{ 

	color:black;
	text-align:right;
	}
	
	#footer{ 

	text-align:left;	 
	position:absolute;
	bottom:0;
    height:60px;   
	}
 
}

@media screen and (min-width: 768px) {
 
 
}

@media screen and (min-width: 900px) {
 
 
}

@media screen and (min-width: 1200px) {
 
 
}

td {
	
	backgroun-color: red;
}

p {
	
	text-align: center;
}