html { 
  background: url(img/tv.gif) no-repeat 0 0 fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body {

}

#content {
	background-color:rgba(255,0,0,0.8);
	margin-left: auto;
    margin-right: auto;
	height:100;
    width: 10%;
	transition:width 0.1s, height 0.1s;
	color:#FFF;	
	
}

#content h1 {
	font-family:"Trebuchet MS", Segoe, "Segoe UI", "DejaVu Sans", Verdana, sans-serif;
	text-align:center;
	font-size:0;
	opacity: 0;
	transition:opacity 0.1s, font-size 0.1s;
}

#content p {
	font-family:"Trebuchet MS", Segoe, "Segoe UI", "DejaVu Sans", Verdana, sans-serif;
	text-align:center;
	font-size:0;
	opacity: 0;
	transition:opacity 0.1s, font-size 0.1s;
}

#content:hover {
	background-color:rgba(255,0,0,0.8);
	height:90%;
    width: 50%;
}


#content a, a:visited{
	color:#FFF;
}

#content a:hover{
	color:#000;
}

#content:hover h1 {
	opacity: 100;
	font-size:50;
}

#content:hover p {
	opacity: 100;
	font-size:30;
}

#button {
    position: fixed;
    width: 500px;
    height: 200px;
    margin: 5% auto; /* Will not center vertically and won't work in IE6/7. */
    left: 0;
    right: 0;
}