@charset "utf-8";
body {
	font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
	background: #42413C;
	margin: 0;
	padding: 0;
	color: #000;
}

body, ul, li, h1, h2, h3, h4, h5, h6, p, form, dl, dt, dd { 
	margin: 0px; 
	padding: 0px; 
	font-size: 12px; 
	font-weight: normal; 
}

ul { list-style: none; }

/* ~~ 元素/标签选择器 ~~ */
ul, ol, dl { /* 由于浏览器之间的差异，最佳做法是在列表中将填充和边距都设置为零。为了保持一致，您可以在此处指定需要的数值，也可以在列表所包含的列表项（LI、DT 和 DD）中指定需要的数值。请注意，除非编写一个更为具体的选择器，否则您在此处进行的设置将会层叠到 .nav 列表。 */
	padding: 0;
	margin: 0;
}

h1{
	font-size: 24px;
}

table{
	width = 600px;	
}

a img { /* 此选择器将删除某些浏览器中显示在图像周围的默认蓝色边框（当该图像包含在链接中时） */
	border: none;
}


a:hover, a:active, a:focus { /* 此组选择器将为键盘导航者提供与鼠标使用者相同的悬停体验。 */
	text-decoration: underline;
}

a {
	color: #000;
}

a:hover {
	color: #F00;
}

/* ~~ 站点链接的样式必须保持此顺序，包括用于创建悬停效果的选择器组在内。 ~~ */
a:link {
	color: #42413C;
	text-decoration: underline; /* 除非将链接设置成极为独特的外观样式，否则最好提供下划线，以便可从视觉上快速识别 */
}
a:visited {
	color: #6E6C64;
	text-decoration: underline;
}

/* ~~ 此固定宽度容器包含其它 div ~~ */
.container {
	width: 800px;
	background: #FFF;
	margin: 0 auto; /* 侧边的自动值与宽度结合使用，可以将布局居中对齐 */
}

/* ~~ 标题未指定宽度。它将扩展到布局的完整宽度。标题包含一个图像占位符，该占位符应替换为您自己的链接徽标 ~~ */
.header {
	background: #ADB96E;
	font-family: Tahoma, Geneva, sans-serif;
	font-size: xx-large;
}

/* ~~ 以下是此布局的列。 ~~ 

1) 填充只会放置于 div 的顶部和/或底部。此 div 中的元素侧边会有填充。这样，您可以避免使用任何"方框模型数学"。请注意，如果向 div 自身添加任何侧边填充或边框，这些侧边填充或边框将与您定义的宽度相加，得出 *总计* 宽度。您也可以选择删除 div 中的元素的填充，并在该元素中另外放置一个没有任何宽度但具有设计所需填充的 div。

2) 由于这些列均为浮动列，因此未对其指定边距。如果必须添加边距，请避免在浮动方向一侧放置边距（例如：div 中的右边距设置为向右浮动）。在很多情况下，都可以改用填充。对于必须打破此规则的 div，应向该 div 的规则中添加"display:inline"声明，以控制某些版本的 Internet Explorer 会使边距翻倍的错误。

3) 由于可以在一个文档中多次使用类（并且一个元素可以应用多个类），因此已向这些列分配类名，而不是 ID。例如，必要时可堆叠两个侧栏 div。您可以根据个人偏好将这些名称轻松地改为 ID，前提是仅对每个文档使用一次。

4) 如果您更喜欢在右侧（而不是左侧）进行导航，只需使这些列向相反方向浮动（全部向右，而非全部向左），它们将按相反顺序显示。您无需在 HTML 源文件中移动 div。

*/

.content {
	padding: 0px;
	float: left;
	width: 800px;
}

/* ~~ 脚注 ~~ */
.footer {
	background: #CCC49F;
	position: relative;/* 这可以使 IE6 hasLayout 以正确方式进行清除 */
	clear: both; /* 此清除属性强制 .container 了解列的结束位置以及包含列的位置 */
	padding-top: 0px;
	padding-right: 0;
	padding-bottom: 0px;
	padding-left: 0;
}

#menu {
	border: 0px;
	float: left;
}

#menu ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

#menu ul li {
	background-color: #ADB96E;
	height: 25px;
	padding: 0px;
	position: relative;
	font-family: "Courier New", Courier, monospace;
	font-size: 18px;
	float: left;
	width: 200px;

}

#menu ul li ul {
	display: none;
	border-top-width: 1px;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: solid;
	border-top-color: #CCC;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	border-left-color: #CCC;
	position: relative;
	height: 25px;
	left: 0px;
	top: 0px;
}

#menu ul li:hover ul {
	display: block;
}

.list1{
	width: 760px;
	position: relative;
	left: 40px;
}
.list2{
	width: 720px;
	position: relative;
	left: 40px;
}

#myProfile{
	width: 100px;
	float:left
}

#myIntroduction{
	width: auto;
	float:left;
	padding: 10px;
}

.clearfloat{
	clear:both;
	}