Hi,

I am wondering how I could make this webpage look better/nicer. I'm not the creative sort of person, so,what do you guys think? I think those big white boxes do not look very good, what would be a better option?

HTML Code:
<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<link rel="stylesheet" href="style2.css"/>
	<title>Title</title>
	
</head>

<body>
	
	<div class="main">
		
		<header>
         
			<nav>
				<ul>
					<li><a href="index2.html">Home</a></li>
					<li><a href="about.html">About</a></li>
					<li><a href="projects.html">Projects</a></li>
					<li><a href="contact.html">Contact</a></li>
				</ul>
			</nav>
            
        </header>
		
			
			<div class="title">
				<h1><u>Ryan Harper</u><h1>
			</div>
				
			<div id="desc">
				<div id="holder">
					<div id="project">IMDb Extractor</div>
					<div id="details">This application is written in Python. It asks you for a movie or TV show, and it then prints out all of the information for that particular movie/tv show.
				internet needed for it to run.</div>
				</div>
				
				<div id="holder">
					<div id="project1">The Solar System</div>
					<div id="details1">This application is written in Python, and uses a GUI framework, in this case, tkinter. It gives you information on all the planets in the solar system.</div>
				</div>
				
				<div id="holder">
					<div id="project2">Project1</div>
					<div id="details2">project details</div>
				</div>
			</div>	
			
	</div>	
		
</body>

</html>
Code:
@font-face{
	font-family: "Delicious";
	src: url("Delicious-Italic.otf");
}
@font-face{
	font-family: "os-semi";
	src: url("semi.ttf");
}

@font-face{
	font-family: "os";
	src: url("os.ttf");
}
.title {
	font-family: "Delicious";
	font-size: 50px;
	color: #336699;
	text-align: center;
	top:50%;
	margin-top: 50px;	
}
u {
	text-decoration: none;
	border-bottom: 2px solid #336699;
} 

body {
	background-color:#CCCCCC;
	
}

#desc{
	
	width: 500px;
	text-align:center;
	margin: 0 auto;
	font-family:"os";
	font-size:40px;
}
#desc span {
	font-size: 40px;
	font-weight: bold;
	font-family: "os-semi";
}
#project1, #project, #project2{
	padding:20px;
}

#details, #details1, #details2{
	display:none;
	font-size:25px
}

#project:hover~#details, #project1:hover~#details1, #project2:hover~#details2{
	display:inline;
}

#holder {
	background-color:white;
	border: 2px solid black;
	border-radius:10px;
	padding: 20px;
	margin:20px;
}

header {
	font-family: "os";
	background-color: #CCCCCC;
	border-bottom: 1px solid rgb(190,187,183);
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
/* 	padding: 0 5%; */
	z-index: 2;
}



header nav {
	float: right;
	overflow: hidden;
	margin-right:50px;
}

header nav li {
	text-decoration: none;
	line-height: 3em;
	color: rgb(102,102,102);
	border-bottom: 1px solid transparent;
	display: block;
	padding: 0 0.6em;
	float: left;
}
header nav li:hover{
	border-bottom: 1px solid #336699;
}
a { text-decoration: none; color:rgb(102,102,102); }
a:visited { text-decoration: none; }
a:hover { text-decoration: none; }
a:focus { text-decoration: none; }
a:hover, a:active { text-decoration: none; }

ul { margin: 0; padding: 0; }
ul li { margin: 0; padding: 0; list-style: none; }
ul li a { color: blue; }
ul li div { display: none; }
Also, "os" is Open Sans Regular, "os-semi" is Open Sans Semibold Italic, and Delicious is Delicious-italic.

How could I make those big white boxes look nicer?