/* CSS Document */

body { background:#000; color:#efefef; font: .85em/1.35 Georgia, "Times New Roman", Times, serif; margin:0; }

#container {
	width:900px;
	margin:0 auto;
}

a:link { color:#ffc;}
a:visited { color:#ffc;}

/* =Global == */

div#globalnav {
	height:15px;
	text-align:right;
	padding-top:10px;
	font:.8em Verdana, Arial, Helvetica, sans-serif;
	padding-bottom: 5px;
	padding-right: 35px;
	background:#666;
	border-bottom:1px solid #9a0000;
}

div#globalnav ul { padding:0; margin:0; float:right;}
div#globalnav li { display:inline; padding: 0 0 0 20px; color:#fff;}

div#globalnav a, div#globalnav a:visited { color:#efefef; text-decoration:none;}
div#globalnav a:hover { color: #f84a08;}


h1 { font-size:2em; color:#f00; font-weight:400; margin-top:10px; margin-bottom:20px; margin-left:35px;  }

/* = Images == */

.thumbnails { float:left; width:130px; margin-left: 35px; }
.thumbnails img { margin:2px; border:1px solid #666; }

#loadarea   	{ float:right; width: 640px; min-height: 400px; }
#loadarea img   { margin-bottom:10px;}

/* = common == */

div.semester { float:right; width: 640px; margin:0; padding: 5px 0; }
p.title      { padding:0; margin-bottom:25px; text-align:center; }
.copy        { float:right; width: 640px; clear:both; font:.75em Tahoma, Geneva, sans-serif; letter-spacing:1px; color:#999; padding-top:20px; }

/* Tablets */

@media screen and (max-width: 959px) { 
 
	#container  { width: 95%; margin: 0 auto; }
	.thumbnails { width:24%; margin: 0 1% 0 0; }
	#loadarea   { width: 75%; min-height: auto; }
	#loadarea img { width: 100%; height:auto; }	
	.copy  { width: 75%;}
	
	div.semester { width: 75%; }
}

/* smart phones and small tablets */

@media screen and (max-width: 749px) {
 
	#container  { width: 95%; margin: 0 auto; }
	.thumbnails  { float:none; width:100% !important; margin: 0; text-align:center; }
	.thumbnails img { width:25px; height:25px; }
	#loadarea    { float:none; width: 100%; min-height: auto; margin-top: 15px; }
	.copy        { float:none; width: 100%; text-align:center; }
	div.semester { float:none; width: 100%; }
 
}